Export the filtered table in CSV with server-side processing

Export the filtered table in CSV with server-side processing

pkyuen1pkyuen1 Posts: 2Questions: 1Answers: 0

Hi guys,

I would like to build a button which exports in CSV my filtered datatable implemented with server-side processing, and I want to go for the approach in the FAQ: Use a server-side process to create the files to download (recommended). Having read through the forum threads, I could find 2 methods which however do not fully solve my issue:

  1. Use windows.location.href - this allows me to export all the records on the server side but I could not send to the server the state of the table on the client side (e.g. search keywords)
$.fn.dataTable.ext.buttons.export =
{
    className: 'buttons-alert',
    id: 'ExportButton',
    text: "Export All To Excel",
    action: function (e, dt, node, config)
    {
        window.location.href = './ServerSide.php?ExportToExcel=Yes';
    }
};
  1. Use AJAX - this allows me to send the datatable state on the client side to the server but I cannot find any way to return a response as a file download (I am using Django in the server side if this matters)
"buttons" : [{
  text: 'export CSV',
  action: function (e, dt, node, config)
  {
    $.ajax({
      "url": "/mysite/download"
      "data": dt.ajax.params()
    });
  }
}]

Is there any way which could accomplish this? In the manual, it reads "When making a request to the server using server-side processing, DataTables will send the following data in order to let the server know what data is required". However, this does not seem to include the action of pressing a datatable button, thanks!

Answers

  • allanallan Posts: 63,338Questions: 1Answers: 10,439 Site admin

    You could combine the two - use something like:

    var params = table.ajax.params();
    window.location.href = './ServerSide.php?ExportToExcel=Yes&dt='+JSON.stringify( params );
    

    Then at the server-side JSON decode the dt request parameter and process it as needed. Or perhaps you could just get only the information you need and send that to the server - the search() and order() methods for example might be all you need for the export.

    Allan

  • pkyuen1pkyuen1 Posts: 2Questions: 1Answers: 0

    Thanks Allan, I have actually resolved the issue with the AJAX option stated above using a callback function upon success which actually can catch the response from the server.

                "buttons": [{
                        text:       'Export CSV',
                        action: function (e, dt, node, config) { 
                            $.ajax({
                                "url": "/mysite/download",
                                "data": dt.ajax.params(),
                                "success": function(res, status, xhr) { 
                                    var csvData = new Blob([res], {type: 'text/csv;charset=utf-8;'});
                                    var csvURL = window.URL.createObjectURL(csvData);
                                    var tempLink = document.createElement('a');
                                    tempLink.href = csvURL;
                                    tempLink.setAttribute('download', 'data.csv');
                                    tempLink.click();
                                }
                            });
                        }
    

    I will test your suggestion later and see if that works, thanks.

This discussion has been closed.