Javascript export csv file name

Question

I have html table (table id='testTable') and a button in html:

 <button id="btnExport" onclick="javascript:xport.toCSV('testTable');">CSV</button>

and javascript code:

toCSV: function(tableId, filename) {
var date=new Date();
this._filename = (typeof filename === 'undefined') ? tableId :      filename;
// Generate our CSV string from out HTML Table
var csv = this._tableToCSV(document.getElementById(tableId));
// Create a CSV Blob
var blob = new Blob([csv], { type: "text/csv" });

// Determine which approach to take for the download
if (navigator.msSaveOrOpenBlob) {
  // Works for Internet Explorer and Microsoft Edge
  navigator.msSaveOrOpenBlob(blob, this._filename + ".csv");
} else {      
  this._downloadAnchor(URL.createObjectURL(blob), 'csv');      
}
}


_tableToCSV: function(table) {
// We'll be co-opting `slice` to create arrays
var slice = Array.prototype.slice;

return slice
  .call(table.rows)
  .map(function(row) {
    return slice
      .call(row.cells)
      .map(function(cell) {
        return '"t"'.replace("t", cell.textContent);
      })
      .join(",");
  })
  .join("\r\n");
}

i want to change the filename to current date how can I do that?

xianshenglu · Accepted Answer · 2018-02-09 12:13:47Z

1

first change toCSV to:

toCSV: function(tableId, filename) {
    var date = new Date();
    this._filename = (typeof filename === 'undefined') ? date : filename;
    // Generate our CSV string from out HTML Table
    var csv = this._tableToCSV(document.getElementById(tableId));
    // Create a CSV Blob
    var blob = new Blob([csv], { type: "text/csv" });

    // Determine which approach to take for the download
    if (navigator.msSaveOrOpenBlob) {
        // Works for Internet Explorer and Microsoft Edge
        navigator.msSaveOrOpenBlob(blob, this._filename + ".csv");
    } else {
        this._downloadAnchor(URL.createObjectURL(blob), 'csv',this._filename);
    }
}

second change _downloadAnchor to:

_downloadAnchor: function(content, ext, filename) {
    var anchor = document.createElement("a");
    anchor.style = "display:none !important";
    anchor.id = "downloadanchor";
    document.body.appendChild(anchor);

    // If the [download] attribute is supported, try to use it

    if ("download" in anchor) {
        anchor.download = filename + "." + ext;
    }
    anchor.href = content;
    anchor.click();
    anchor.remove();
}

edited Feb 9, 2018 at 12:13

answered Feb 9, 2018 at 11:29

xianshenglu

5,4483 gold badges21 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

xianshenglu Over a year ago

you need show function: _tableToCSV ,,,,the problem is the function,i think

nnox Over a year ago

I found the problem I think.Button toCSV('testTable') and it returns filename testTable.How can I add date to filename

xianshenglu Over a year ago

@Nur, still need function _downloadAnchor,you can try the code with ms browser first

xianshenglu Over a year ago

@Nur key is _downloadAnchor ,need to know

nnox · Accepted Answer · 2018-02-09 11:58:04Z

0

  _downloadAnchor: function(content, ext) {
  var anchor = document.createElement("a");
  anchor.style = "display:none !important";
  anchor.id = "downloadanchor";
  document.body.appendChild(anchor);

  // If the [download] attribute is supported, try to use it

  if ("download" in anchor) {
    anchor.download = this._filename + "." + ext;
  }
  anchor.href = content;
  anchor.click();
  anchor.remove();
   }

answered Feb 9, 2018 at 11:58

nnox

315 bronze badges

1 Comment

nnox Over a year ago

@xianshenglu this

Collectives™ on Stack Overflow

Javascript export csv file name

2 Answers 2

4 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related