0

I want to export my html table to CSV file. Is there any simple code? Where user will use either two or three steps and CSV will download.

<table>
  <thead>
    <tr>
      <th>1</th>
      <th>2</th>
    </tr>
  </thead>
  <tr>
    <td rowspan='2'>3</td>
    <td>4</td>
  </tr>
  <tr>
    <td>5</td>
  </tr>
  <tfoot>
    <tr>
      <th colspan='2'>6 <span style='display:none'> 7 
</span> 8</th>
    </tr>
  </tfoot>
</table>
Brian Tompsett - 汤莱恩
  • 5,195
  • 62
  • 50
  • 120
  • 3
    https://www.google.co.uk/search?q=convert+HTML+to+CSV&oq=convert+HTML+to+CSV&aqs=chrome..69i57j0l5.5468j0j7&sourceid=chrome&ie=UTF-8 Did you do any research? – ADyson Aug 30 '17 at 11:05
  • use jQuery and loop through the children of table. – Dasma Aug 30 '17 at 11:09
  • Possible duplicate of [Convert HTML to CSV in php?](https://stackoverflow.com/questions/10836637/convert-html-to-csv-in-php) – Arun Vitto Aug 30 '17 at 11:10
  • Arun Vitto it is not a duplicate. This question has nothing to do with php. – Dasma Aug 30 '17 at 11:13
  • @Dasma TBF it's not clear - it's tagged with both. OP didn't specify whether the solution should be in JS or PHP. OTOH they seem to have found a solution online 2 minutes after I suggested googling it. – ADyson Aug 30 '17 at 11:14
  • Possible duplicate of [Export to CSV using jQuery and html](https://stackoverflow.com/questions/16078544/export-to-csv-using-jquery-and-html) – Dave Jarvis Apr 21 '18 at 00:55

1 Answers1

5

tabletoCSV is a minimalist jQuery tool used to convert / export an html table into a CSV (Comma Separated Values) file. Just use these three simple steps and CSV will export.

1. Include jQuery library and the jQuery tabletoCSV plugin on the web page.

    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <script src="http://www.jqueryscript.net/demo/jQuery-Plugin-To-Convert-HTML-Table-To-CSV-tabletoCSV/jquery.tabletoCSV.js"></script>

2. Add a button for table to CSV export.

    <button id="export" data-export="export">Export</button>

3. Enable the Table To CSV tool.

    $("#export").click(function(){
      $("table").tableToCSV();
    });
  • 1
    If you knew the answer, why ask?? – Rotimi Aug 30 '17 at 11:10
  • The solution is incomplete as an answer without including tableToCsv.js here or at least linking to where it can be downloaded. I see you found a solution very quickly once you actually tried to look it up, though. – ADyson Aug 30 '17 at 11:15
  • 1
    P.S. I saw that you tried to deface one of my previous answers to another question. The edit was rejected and I reported it as vandalism. That is not the way to respond to criticism. If you have a problem with what I wrote, please say so here. In my opinion you posted a question hoping for a quick and easy answer without having to make any effort yourself. That is not how this site works - people volunteer and make effort to answer questions. They expect the same effort from askers. Your question has been solved many times before, hence the google link. You should show more initiative. – ADyson Aug 30 '17 at 11:25
  • 1
    And the downvote on _this_ answer is because of what I said, very clearly, above. It's incomplete. This code, on its own, does not work. You need to explain where you got the custom tableToCsv JS file from, otherwise others cannot re-use this example. Sure, they could google it too, but who knows if they find the same file or not? It would be the work of a moment to create a new Github page with the same filename offered, but doing something different entirely. – ADyson Aug 30 '17 at 11:27
  • 1
    "You should have explain me the problem and solution. " Why? That's quite a sense of entitlement you've got there. You're not paying me. I'm not contracted. I'm under no obligation to do anything at all. You missed or ignored my point about people here being volunteers and expecting some equivalent effort from the people asking the questions. We'd like to know that you at least tried to solve your problem. The thing you requested has been asked and answered many times before on sites all across the net. – ADyson Aug 30 '17 at 11:52
  • The fact you found a solution 2 minutes later suggests clearly that you put absolutely no effort whatsoever into your initial question, and just hoped someone else would do it all for you. Why should I give my time to help someone who can't be bothered to help themselves? The reason I started writing comments on this question was actually to try and help you use this site better, and also understand that many things have already been solved, and you can find the answers easily already without people needing to re-write them here. – ADyson Aug 30 '17 at 11:54
  • But your reaction afterwards - trying to vandalise my previous posts (if anyone is reading this, please know that @ManvendraRajpurohit submitted an edit which tried to overwrite a previous accepted answer of mine one someone else's question with random dots), and your expectation that I "should" help you, is a) childish and b) arrogant. Because of those things I will not try to help you again. – ADyson Aug 30 '17 at 11:55
  • I don't _have_ to do anything, as I already explained. You seem to think the site and its volunteers are here for your convenience, which is bizarre. And I did explain your problem - I gave you a link to Google which contained many examples of solving your problem. No need to re-write what already exists. My disappointment was that you could have found it yourself without asking for other people to help you. Once you _did_ do that, you found the solution quickly. And my earlier comments, before your childish action, were not rude at all, they asked simple questions and stated simple facts. – ADyson Aug 30 '17 at 12:54
  • If you were disappointed by what I said/did, then you should have commented. Only children lash out with unrelated actions. As for the downvotes: Firstly I'm not the only one; Each user can only make one downvote per item. Secondly if you read the guidance on what constitutes a reason for downvoting, the reasons are clear and simple - on the question "The question does not show any research effort". And on the answer "This answer is not useful" (because it is incomplete as already explained. If you edit the answer with a link to the mentioned JS file then I will happily remove that downvote). – ADyson Aug 30 '17 at 12:56
  • If you so choose, you could also delete the question completely, in which case this entire dialogue, which is quite embarrassing from your point of view, would disappear, and your reputation points would be restored. – ADyson Aug 30 '17 at 12:58
  • Equally I am disappointed when junior programmers don't try to help themselves before asking senior programmers to spend their time on repeating things which are already available on multiple existing sites and easily discoverable on google. If your heart was truly broken by this then you clearly have very little else ever to upset you in your life, and I envy you. Either that or everything has always been given to you on a plate, and you can't cope with being told "no". P.S. you can definitely delete the question. https://meta.stackexchange.com/questions/42265/how-can-i-delete-my-question – ADyson Aug 30 '17 at 14:23