Datatable serverside export not working in Angular

saj28

Iam using jquery datatable in angular(v-12) application. Datatable rendering,server side pagination and sorting working fine. While exporting the data to excel/pdf it only exporting the current page data. But i wanted to export the full data from server side.Can you pls help here.

kthorngren

See this FAQ.

Kevin

saj28

Thanks @kthorngren .for your response.
There is a option to export the entire data from server side in jquery datatable. But i couldn't get this server side export in angular.

Ref : https://localcoder.org/how-to-export-all-rows-from-datatables-using-ajax

kthorngren

Without trying the solutions presented in that article its hard to say if they work. There are some threads on this forum, I don't have links for them, that also have solutions that worked for some people.

Without a link to your page or a test case showing the issue its hard to say what the problem might be. My suggestion is to use one of the Datatables JS Bin SSP templates and build one of the solutions you find. This way if you have issues we can take a look.

Kevin

saj28

this.dtOptions = {  
      pagingType: 'full_numbers', 
      columns: columnNames,  
      pageLength: 10,         
      searching: false, 
      order: [[ 1, 'asc' ]],
      serverSide: true, 
      processing: false,
      responsive: true,
      lengthMenu: [[10, 25, 50, -1], [10, 25, 50, 'All']],
      language: {
        loadingRecords: ' ',
        processing: '<div class="spinner">Loading.....</div>',
        zeroRecords: "No records available",
        paginate: {
          next: '<i class="fa fa-forward"></i>',
          previous: '<i class="fa fa-backward"></i>',
          first: '<i class="fa fa-step-backward"></i>',
          last: '<i class="fa fa-step-forward"></i>'
        }
      },
      dom: 'lBrtip',
      buttons:[{
        extend: 'excelHtml5',
        text: '<i class="fa fa-file-excel-o"></i>',
        titleAttr: 'Excel',
        className: 'export-btn',
        exportOptions: {
          customizeData: function (d) {
            $.fn.dataTable.ext.buttons.excelHtml5
            var exportBody = this.GetDataToExport();
            d.body.length = 0;
            d.body.push.apply(d.body, exportBody);
          }
        }
      }],
    };
    return this.dtOptions;
  }
  
  
  GetDataToExport(){
  // Ajax Call
  }
  
  
  this.dtOptions.ajax = (dataTablesParameters: any, callback) => {
   // Server side ajax call to load data
  };

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

Exporting data when serverSide is in use isn't something that's supported by default, but a few threads, such as here and here, discuss potential solutions,

Colin