Datatable serverside export not working in Angular

Datatable serverside export not working in Angular

saj28saj28 Posts: 3Questions: 0Answers: 0

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.

Replies

  • kthorngrenkthorngren Posts: 21,445Questions: 26Answers: 4,974

    See this FAQ.

    Kevin

  • saj28saj28 Posts: 3Questions: 0Answers: 0

    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

  • kthorngrenkthorngren Posts: 21,445Questions: 26Answers: 4,974

    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

  • saj28saj28 Posts: 3Questions: 0Answers: 0
    edited May 2022
    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.

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    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

Sign In or Register to comment.