Datatables serverside / scroller issue

Datatables serverside / scroller issue

jadsy2107jadsy2107 Posts: 4Questions: 2Answers: 0

Hi all,

I'm having issue with scroller with server-side ajax.
When you scroll to a certain length, (anything beyond 500) and refresh the page, all you see is white, and Showing x of x - changes and is incorrect.

Visit https://ngn.au/shop/all

 $(document).ready(function(){
    var table =  $('#stockTable').DataTable({
        scrollResize: true,
        scrollY: 500,
        lengthChange: true,
        scroller:       true,
        responsive: true,
        details: {
            type: 'column'
        },
        deferRender:    true,
        processing: true,
        serverSide: true,
        serverMethod: 'post',
                    stateSave: true,
            ajax: {
    'url':"https://ngn.au/getStock/all///",
    'data': function(data){
           // CSRF Hash
           var csrfName = $('.txt_csrfname').attr('name'); // CSRF Token name
           var csrfHash = $('.txt_csrfname').val(); // CSRF hash

           return {
              data: data,
              [csrfName]: csrfHash // CSRF Token
          };
      },
      dataSrc: function(data){

          // Update token hash
          $('.txt_csrfname').val(data.token);

          // Datatable data
          return data.aaData;
      }
  }, 
  "columnDefs": [{
    "targets": 3,
    "render": function ( data, type, row, meta ) {
        var itemID = row['id'];
        return '<a href="/product/'+ itemID + '">' + data + '</a>';
    },
},          {
    "targets": 2,
    "render": function ( data, type, row, meta ) {
        var Vendor = row['Vendor'];
        return '<a href="/shop/'+ Vendor + '">' + data + '</a>';
    },
},
// give details button seperate tab, 
{
    target: 0,
    "render": function ( data, type, row, meta ) {
        return '';
    },        
    orderable: false,
    searchable: false,
},
{
        className: 'dtr-control',
        orderable: false,
        targets:   0
}, 
{ 
    responsivePriority: -1, 
    targets: 3 
}
], 
'columns': [
{ data: 'id' },
{ data: 'StockCode' },
{ data: 'Vendor' },
{ data: 'StockDescription' },
{ data: 'RRPEx' },
{ data: 'StockAvailable' },
]

});
});

Steps to Reproduce:
Scroll down to past 500 , refresh page

Sign In or Register to comment.