Обнаружить изменение страницы в DataTable

Вы можете использовать fnDrawCallback или fnInfoCallback для обнаружения изменений, при следующем нажатии на них оба они запускаются .

Но будьте осторожны, изменения страниц не являются единственным источником, который может обжечь эти обратные вызовы.

События пейджинга обрабатываются таким образом,

$(document).ready(function() { $('#example') .on( 'order.dt', function () { console.log('Order' ); } ) .on( 'search.dt', function () {console.log('Search' ); } ) .on( 'page.dt', function () { console.log('Page' ); } ) .dataTable(); } ); 

задокументированы на официальном сайте, здесь http://www.datatables.net/examples/advanced_init/dt_events.html

Событие length.dt запускается всякий раз, когда изменяется длина страницы таблицы

 $('#example').dataTable(); $('#example').on( 'length.dt', function ( e, settings, len ) { console.log( 'New page length: '+len ); } ); 

http://datatables.net/reference/event/length

Больше событий здесь

datatables.net/reference/event/

Если у вас версия более 1,8, вы можете использовать ее, чтобы попасть на события смены страницы:

  $('#myTable').on('page', function () {...} ); 

Надеюсь это поможет!

ОБНОВИТЬ:

В некоторых комментариях указывалось, что с помощью .live () вместо .on () работал на них. Имейте в виду, что вы должны попробовать оба и посмотреть, какой из них лучше всего подходит в ваших конкретных обстоятельствах! (Я считаю, что это может иметь отношение к вашей версии на jQuery, но, пожалуйста, прокомментируйте, если вы найдете другую причину!)

Я начал работать, используя:

 $('#id-of-table').on('draw.dt', function() { // do action here }); 

 $('#tableId').on('draw.dt', function() { //This will get called when data table data gets redrawn to the table. }); 

Альтернативный подход состоял бы в том, чтобы зарегистрировать обработчик событий на странице разбиения на страницы так:

 $("#dataTableID_paginate").on("click", "a", function() { alert("clicked") }); 

Разумеется, замените «#dataTableID_» на идентификатор вашей таблицы. И я использую метод JQuery ON, так как это лучшая практика.

Попробуйте использовать делегат вместо живого, как здесь:

 $('#link-wrapper').delegate('a', 'click', function() { // do something .. } 

Это хорошо работает

 $('#id-of-table').on('draw.dt', function() { // do action here }); 

Это работает, когда я нажимаю кнопку «Далее»

 $('#myTable').on('draw.dt', function() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; }); 

В моем случае событие ‘page.dt’ не выполняло трюк.

Вместо этого я использовал событие «draw.dt», и он работает !, некоторый код:

 $(document).on('draw.dt', function () { //Do something }); 

Событие «Draw.dt» запускается каждый раз, когда изменяются данные, изменяющиеся по дате, путем поиска, упорядочивания или изменения страницы.

/ ***** Дополнительная информация ***** /

Есть несколько отличий в том, как мы можем объявить слушателя событий. Вы можете присвоить его «документу» или «html-объекту». Слушатели «документа» всегда будут существовать на странице, а слушатель «html object» будет существовать только в том случае, если объект существует в DOM в момент объявления. Некоторый код:

// Документ прослушивателя событий

 $(document).on('draw.dt', function () { //This will also work with objects loaded by ajax calls }); 

// HTML-прослушиватель событий объекта

 $("#some-id").on('draw.dt', function () { //This will work will existing objects only }); 

Я ничего не нашел в API, но одна вещь, которую вы могли бы сделать, это подключить обработчик событий к стандартному указателю и определить, изменилось ли оно:

 $('.dataTables_length select').live('change', function(){ alert(this.value); });