13

I have the following function that exports an HTML to excel:

function generateexcel(tableid) {
  var table= document.getElementById(tableid);
  var html = table.outerHTML;
  window.open('data:application/vnd.ms-excel,' + encodeURIComponent(html));
}

The problem is that, i can't put a specific file name to save as so the user gets something like:

Do you want to save %3Ctable%20id%3D%22tableRslts%22%20tabindex%3D%2235%22%20 file?

And the saved file is like:

IytvT8Jo.xls.part.xls (at least in Firefox which is the target browser we will use)

How would you fix this?

Arun Singh
  • 1,538
  • 4
  • 19
  • 43
VSP
  • 2,367
  • 8
  • 38
  • 59
  • Is it really true that Excel will directly import an HTML table? Anyway have you tried giving the window a name (second parameter to `window.open()`? (*edit* well gnumeric will happily consume a table, so I'm guessing Excel will too. Huh.) – Pointy Jun 18 '12 at 13:54
  • It must be true if i am already using this script :P if not i have a big problem at hands...about window name i tried it now without success but thanks for the tip anyway... – VSP Jun 18 '12 at 15:27
  • Wouldn't [this](http://stackoverflow.com/questions/1479020/save-the-document-generated-by-javascript) help? – Elias Van Ootegem Jul 03 '12 at 11:34
  • @EliasVanOotegem Activex solution only works for IE i think :S – VSP Jul 04 '12 at 06:35

2 Answers2

3

There are two options which you could look into:

  • Filesaver API is new 'HTML5' functionality allowing /exactly/ this. There is just one small problem: the relevant part isn't supported yet in firefox. If you want to use this there is a nice wrapper library which makes this easier for you: filesaver.js
  • Downloadify is a flash tool which is created for exactly this as well, you can find it here. ('Disadvantage': flash)
David Mulder
  • 26,123
  • 9
  • 51
  • 114
  • Tried filesaver.js demo page, worked fine with chrome, in firefox (14.0.1) it only opened a new tab with the contents...and being firefox our target platform.... Downloadify worked fine in firefox but i will have to try to implement it in our website to see if its feasible (asp.net + ajax.net + there are multiple tables to which we added the export as excel button next to each one dinamically by javascript) – VSP Jul 04 '12 at 06:43
  • Yeah, that's why I said 'the relevant part isn't supported yet in firefox'@filesaver. But as far as I know the downloadify one should work perfectly fine. – David Mulder Jul 04 '12 at 07:49
1

I'm not sure if you have done this already. You might need to handle something like this below in your aspx page:

$(window).load(function(){
$( "#clickExcel" ).click(function() {  
var dtltbl = $('#dtltbl').html();    `enter code here`
window.open('data:application/vnd.ms-excel,' + $('#dtltbl').html());
});
});//]]>

In the above script #dtltbl is the Table Id.

The following code needs be there in your server side code, then your problem would be solved.

           Response.AddHeader("Content-Disposition", "attachment;filename=myfilename.csv");
Siva Karthikeyan
  • 544
  • 8
  • 25
  • Also check [this link](http://stackoverflow.com/questions/393647/response-content-type-as-csv) it might be of useful to you. – Siva Karthikeyan Jul 10 '12 at 04:44
  • The problem with this is that you need to make a postback to the server in order to add the header. The idea of using this function is generate the excel from the client directly throught javascript – VSP Jul 10 '12 at 07:31
  • This gives an fair appraoch on handling the export without server side code, see if it meets your requriements http://stackoverflow.com/questions/3286423/is-it-possible-to-use-any-html5-fanciness-to-export-local-storage-to-excel – Siva Karthikeyan Jul 10 '12 at 09:53