How to change the name of file while exporting data to Excel?

Question

How do I change the name of file while exporting data to Excel?

<div id="example" class="k-content">
    <button type="button"id="btnExport">Export to csv!</button>
    <div id="grid"></div>
</div>
<script>
$("#btnExport").click(function (e) {
    var result = "data:application/vnd.ms-excel,";

    window.open(result);

    e.preventDefault();
});
</script>

When I click the export button I am getting as download.xls. Is it possible to set the file name as data.xls? Can any one explain me where I need to configure that?

hai I had checked with the response.addheader but no use.Is there any alternative to change the name of the file — user1877936, Mar 12 '13 at 06:42
when I add the response.Addheader it was showing an error like undefined identifier — user1877936, Mar 12 '13 at 12:18

score 10 · Accepted Answer · edited May 17 '16 at 15:31

10

here is an example which demonstrates Export HTML Table to Excel With Custom File Name: http://www.kubilayerdogan.net/javascript-export-html-table-to-excel-with-custom-file-name/

edited May 17 '16 at 15:31

katmanco

1,146
12
24

answered Mar 28 '13 at 05:18

kvs

466
1
10
24

score 6 · Answer 2 · answered Jul 18 '18 at 16:23

Not only for excel, in addition, for many kind of format can useable.

 var element = document.createElement('a');
            element.setAttribute('href', 'data:application/vnd.ms-excel,' + encodeURIComponent(htmlTable));
            element.setAttribute('download', fileName);
            element.style.display = 'none';
            document.body.appendChild(element);
            element.click();
            document.body.removeChild(element);

https://ourcodeworld.com/articles/read/189/how-to-create-a-file-and-generate-a-download-with-javascript-in-the-browser-without-a-server

score 3 · Answer 3 · edited Mar 27 '16 at 22:37

I had the same issue, and since the new format (maybe not supported by every browser) <a download=""></a> the following worked fine for me. This use directly HTML/Javascript without the PHP server part, because using a submit form is too heavy for big data tables.

changing <button> to <a>
no more window.open()
using the basic <a> behavior (so, no more e.preventDefault()) but changing href to data:blabla and adding download="filename" :

<div id="example" class="k-content">
    <a href="#" id="btnExport" >Export to csv!</a>
    <div id="grid"></div>
</div>
<script>
    $("#btnExport").click(function (e) {
        var result = "data:application/vnd.ms-excel,";
        this.href = result;
        this.download = "my-custom-filename.xls";
        return true;
    });
</script>

It works great, but for some reason changing `button` to `a` caused Windows to block the file (https://weblogs.asp.net/dixin/understanding-the-internet-file-blocking-and-unblocking). Any idea how to work around this issue? — HuBeZa, Jan 22 '17 at 07:41

Red · Answer 4 · 2013-03-12T06:07:34.610

1

You can't do this with client-side JavaScript, you need to set the response header...

.NET

Response.AddHeader("Content-Disposition", "inline;filename=filename.xls")

Or PHP

$filename = 'somehting.xls';

header('Content-Disposition: attachment; filename="'.$filename.'"');

edited Mar 12 '13 at 06:07

answered Mar 12 '13 at 05:57

Red

6,230
12
65
112

1

http://jsfiddle.net/SZBrt/11/ I placed the code but i am getting error can you please update in this fiddle – user1877936 Mar 12 '13 at 06:02
yes I tried with the response.Add header when i add it the button export is not working – user1877936 Mar 12 '13 at 06:11

score 1 · Answer 5 · edited Mar 27 '16 at 21:43

1

Response.AddHeader "Content-Disposition", "attachment; filename=C:\YOURFILENAME.xls;"

edited Mar 27 '16 at 21:43

David Arenburg

91,361
17
137
196

answered Mar 27 '16 at 18:21

ebms meeran

11
1

2

While this answers the question, an explanation helps everyone understand what's going on. – Kristján Mar 27 '16 at 19:58

score 0 · Answer 6 · edited Apr 21 '18 at 08:05

0

var a = document.createElement('a');
//getting data from our div that contains the HTML table
var data_type = 'data:application/vnd.ms-excel';
a.href = data_type + ', ' + encodeURIComponent(tab_text);
//setting the file name
a.download = 'SupervisorReport.xls';
//triggering the function
a.click();
//just in case, prevent default behaviour
e.preventDefault();
return (a);

edited Apr 21 '18 at 08:05

NightOwl888

55,572
24
139
212

answered Apr 21 '18 at 07:29

Pankaj Jha

1
2

How to change the name of file while exporting data to Excel?

6 Answers6

Linked