2017-02-17 6 views
0

У меня есть jquery datatable, который нужно разбить на страницы. Я использовал событие page-dt для запуска функции загрузки данных со стороны сервера при нажатии на номер страницы. Затем я использовал $('#table').dataTable().fnAddData(recordsArray); для добавления вновь полученных данных в таблицу. Это происходит успешно. Моя проблема заключается в том, что при добавлении данных к таблице она сохраняется на первой странице, несмотря на событие click. Я пробовал с table.rows.add(recordsArray).draw(); и fnDrawCallback событием, но все равно не имел успеха.Datatable - изменение на страницу с щелчком после обратного вызова

 $(document).ready(function() { 
      table = $('#table').DataTable({ 
       "filter": true, 
       "paging":true, 
       "pagingType": "full_numbers", 
       "pageLength": 5, 
       scrollCollapse: true, 
       scrollY:'70vh', 
       "dom": '<"dataTablesTop"' + 
       'f' + 
       '<"dataTables_toolbar">' + 
       '>' + 
       'rt' + 
       '<"dataTablesBottom"' + 
       'lip' + 
       '>', 
       "info":true 
      }); 
     $('#table').on('page.dt', function (e, settings) { 
      // console.log(JSON.stringify(settings)); 
      update(settings); 
     }); 
     }); 

Это метод update().

update = function(data) { 
     alert(data); 
     var displayStart = data._iDisplayStart; 
     var displayLength = data._iDisplayLength; 
     var records = data.aiDisplay.length; 
     if(displayStart != 0) { 
      var data = getProviderData(displayStart, displayLength, records, true); 
      for(var i = 0; i < data.length; i++) { 
       no = no + 1; 
       data[i].no = no; 
       try { 
        var json = data[i].jsonBody.replace(/\\n/g, "") 
         .replace(/\\'/g, "\\'") 
         .replace(/\\"/g, '\\"') 
         .replace(/\\&/g, "\\&") 
         .replace(/\\r/g, "\\r") 
         .replace(/\\t/g, "\\t") 
         .replace(/\\b/g, "\\b") 
         .replace("%", "") 
         .replace(/\\f/g, "\\f"); 

        data[i].jsonContent = JsonHuman.format(JSON.parse(json)).outerHTML; 
       } 
       catch (e) { 
        data[i].jsonContent = data[i].jsonBody; 
       } 
      } 

      var recordsArray = []; 
      for(var j = 0; j < data.length; j++) { 
       var temp = []; 
       temp.push(data[j].no); 
       temp.push(data[j].responseTime); 
       temp.push(data[j].api); 
       temp.push(data[j].jsonContent); 
       recordsArray.push(temp); 
      } 
      // table.rows.add(recordsArray).draw(); 
      $('#table').dataTable().fnAddData(recordsArray); 
     } 
     // drawGadget(); 
     // wso2gadgets.update(data,"append"); 
return; 
    }; 

Please see the screenshot

Цените любые материалы по этому вопросу.

Заранее благодарен!

+0

Из того, что я помню, у datables была опция, где вы можете автоматически использовать данные на datatable newpage. – madalinivascu

+0

https://datatables.net/examples/data_sources/server_side.html – madalinivascu

+0

Это не для новой страницы. Предположим, что я изначально загрузил 2-3 страницы. Затем, когда я нажимаю на вторую страницу, мне нужны данные для 4-й страницы для загрузки и перемещения на вторую страницу. – Marlio

ответ

0

Я получил это просто, сделав table.rows.add(recordsArray).draw(); до table.rows.add(recordsArray).draw(false);.

+1

Ницца! вот ссылка на документы [function docs] (https://datatables.net/reference/api/draw%28%29), если кто-то хочет узнать больше. – Sebastianb