HTML Table to CSV

This is small JQuery utility which allows you to export any HTML table as CSV file. Its very handy tool to use specially during development of reporting projects. It is also useful when you have some 3rd party JQuery table search plugin attached to your table.

Example

Title Name Phone
Mr. John 07868785831
Miss Linda 0141-2244-5566
Master Jack 0142-1212-1234
Mr. Bush 911-911-911

Option 1  Option 2  Option 3  Option 4  Download   Comments About Me

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js" > </script>
<script type="text/javascript" src="http://www.kunalbabre.com/projects/table2CSV.js" > </script>

Download Plugin    

Option 1

$('#example1').table2CSV();



Option 2

This can be used when you need custom header
$('#example1').table2CSV({
	header:['prefix','Employee Name','Contact']
});



Option 3

This can be used when you need to get output as string 
alert(
$('#example1').table2CSV({
delivery:'value',
header:['prefix','Employee Name','Contact']
}));



Option 4

This can be used when you need different separator 
alert(
$('#example1').table2CSV({
separator : ';',
delivery:'value',
header:['prefix','Employee Name','Contact']
}));

Comments

Name:

Email:

Comments:



On 20/05/09 from Raju email ysamala@gmail.com 208.75.144.8
Why this example doesn\'t ask to save the file...? Can you please let me know how to make it work like that ? Thanks, Raju
On 29/05/09 from Kunalbabre email 82.132.136.222
Hi Raju, This is something I would like to add in near future. One of the solution can be to post the data to server and make server write csv file which is generic
On 23/06/09 from Johnny Zhou email johnny-wei.zhou@ubs.com 147.60.1.231
I also want to save the csv as file
On 24/06/09 from Jay Desai email desaij@hotmail.com 129.33.49.251
Hey thanks a bunch for this plug-in... It is okay under the license to modify some code and use it? I have to extend it to allow which columns to pick... because my table has links for actions on the last column, but I dont want to export that
On 04/07/09 from Kunal Babre email 92.235.216.78
Hi Jay, yup you can modify the script way you want
On 09/07/09 from Tom9279 email tom9729 at gmail dot com 151.190.254.108
Very helpful plugin, thank you. My only suggestion is that this should trim white space from each cell before adding it to tmprow. The save-to-file support is pretty easy to add yourself (to anyone who is looking for that functionality). See the thread here: http://stackoverflow.com/questions/921037/jquery-table-to-csv-export
On 30/07/09 from Jay desai email desaij@hotmail.com 129.33.49.251
Here\'s the modified code, it allows you to specify a \"howmany\" option which determines how many columns from the left you want to export... I made this modification because most of my tables, the last column is \"Action\" links which I don\'t want to export......
jQuery.fn.table2CSV = function(options) { var options = jQuery.extend( { separator : \',\', header : [], delivery: \'popup\', // popup, value howmany: -1 } , options); var csvData = []; var headerArr = []; var el = this; //header var numCols = options.header.length; var tmpRow = []; // construct header avalible array if(numCols> 0 ) { for(var i=0;i<numCols; i++){ tmpRow[tmpRow.length] = formatData(options.header[i]); } } else { $(el).filter(\':visible\').find(\'th\').each(function () { if ($(this).css(\'display\') != \'none\') tmpRow[tmpRow.length] = formatData($(this).html() ); } ); } row2CSV(tmpRow); // actual data $(el).find(\'tr\').each(function () { var tmpRow = []; $(this).filter(\':visible\').find(\'td\').each(function() { if ($(this).css(\'display\') != \'none\') tmpRow[tmpRow.length] = formatData($(this).html()); } ); row2CSV(tmpRow); } ); if (options.delivery==\'popup\') { var mydata = csvData.join(\'\\n\'); return popup (mydata); } else { var mydata = csvData.join(\'\\n\'); return mydata; } function row2CSV(tmpRow) { var tmp = tmpRow.join(\'\') // to remove any blank rows if (tmpRow.length > 1 && tmp != \'\') { if (options.howmany != -1){ tmpRow = tmpRow.slice(0,tmpRow.length-1); } var mystr = tmpRow.join(options.separator); csvData[csvData.length] = mystr; } } function formatData(input) { // replace \" with “ var regexp = new RegExp(/[\"]/g); var output = input.replace(regexp, \"“\"); //HTML var regexp = new RegExp(/\\<[^\\<]+\\>/g); var output = output.replace(regexp, \"\"); if (output == \"\") return \'\'; return \'\"\' + output + \'\"\'; } function popup(data) { var generator = window.open(\'\', \'csv\', \'height=400,width=600\'); generator.document.write(\'<html><head><title>CSV</title>\'); generator.document.write(\'</head><body >\'); generator.document.write(\'<textArea cols=70 rows=15 wrap=\"off\" >\'); generator.document.write(data); generator.document.write(\'</textArea>\'); generator.document.write(\'</body></html>\'); generator.document.close(); return true; } }; $(document).ready(function() { } );

On 30/07/09 from Jay Desai email desaij@hotmail.com 129.33.49.251
Did not paste correctly... I guess email me if you want a copy of it...
Hi Jay email me at mail at kunalbabre.com,
Thanks ,
kunal
On 30/10/09 from Evttaujt email kidrock@msn.com 220.181.53.250
perfect design thanks
On 04/11/09 from Jay Desai email desaij@hotmail.com 129.33.49.251
Hey Kunal, I emailed you the code to emit the last column... Currently it omits the last column by checking howmany as a flag if (options.howmany != -1){ tmpRow = tmpRow.slice(0,tmpRow.length-1); } However, it could be easily changed to the following to use the option howmany as a numerical value corresponding to the number of columns from left to right... if (options.howmany != -1){ tmpRow = tmpRow.slice(0,howmany); }
On 17/11/09 from Sudhakar email sm6911@att.com 135.214.40.30
Kunal, Thanks, I saw your code and how i implement the download without going to jQuery site. I have copied table2CSV.js code but I want to avoid going to jQuery site and use it. Plaese guide me in this thing.
On 19/11/09 from Jbqvebbl email deadman@gmail.com 59.33.247.10
this is be cool 8)
On 24/12/09 from Joe Scarpetta email joe@apphiasolutions.com 98.216.28.238
What is the easiest option to have this export to a file? It works perfectly, but I need it to download as file. Any help appreciated. Thanks, Joe
@ from Kunal
Hi Joe, Simplest way of exporting it to file is post the string data to script on server and make that script write the file back. If you need example let me know.

On 07/04/10 from Beck email 147.186.255.54
Nice plugin, thanks!
On 17/04/10 from Rich email rbraman@searchclickz.net 76.110.216.135
Nice plugin. 1 feature request: let the programmer query the table by row or column. In some instances the user may need the data to be indexed on the column. Should I tackle this I will send you the code
On 28/04/10 from 123 email 1 220.117.202.16
11111
On 06/05/10 from ff email ff 122.166.1.170
ff
On 19/05/10 from dasfdsfsd email asdfsdf 213.221.235.66
fdgfg
On 19/05/10 from dfd email dfd@dfd.com 213.221.235.66
dfd
On 21/05/10 from Jonny email smith@jonny.com 213.5.71.85
9c9rxp Cool lol hey bla bla bla bla
On 21/05/10 from Jonny email smith@jonny.com 213.5.71.85
bqcjUT Cool lol hey bla bla bla bla
On 21/05/10 from Jonny email smith@jonny.com 213.5.71.85
KszGjE Cool lol hey bla bla bla bla
On 21/05/10 from Jonny email smith@jonny.com 213.5.71.85
OcaUPR Cool lol hey bla bla bla bla
On 26/05/10 from JB email jarrod.barker@gmail.com 203.206.165.219
Thanks for this, well done. It would be great if you could post or email an example of how to save the CSV formatted data to a file on the client.
On 30/05/10 from Nicola email Petruzzelli Niocola 84.220.40.150
Hi, it\'s possible to forcing directly download csv file? for example: instead to show textArea... download file \"myFile.csv\"
On 11/06/10 from Kefeng email zkf9971@hotmail.com 130.214.25.250
Hi, the utility is very cool, I like it. I want to know how to convert html to csv format file. thanks.
On 22/06/10 from lol email lol 207.255.100.103
lol
On 30/06/10 from Thomas email thomasjee.c@gmail.com 212.113.67.10
Could anyone send me some code how to export the csv as a file so i get the \'save as\' window? email: thomasjee.c@gmail.com
On 23/07/10 from Cxqxtvao email uynvwfel@vldksjtu.com 213.5.64.19
6u6P49 Zezgzbh oegqj elwy mriwzzue atjcvryaur ogfj cmvg mppyetlxr qovfvg nepldughi lylahbc.
On 24/07/10 from movado outlet email wpkeisni@zsoqbjrf.com 213.5.64.19
knw, ltfle, 641917, 7429, 89679, 42294, >:-OO,