Как сбросить разбиение на страницы в JQuery datatable

У меня есть JQuery datatable, который загружает данные через запрос ajax. В таблице есть форма, которая позволяет пользователю фильтровать результаты на сервере. Когда пользователь меняет форму фильтра, я вызываю fnReloadAjax() с новыми данными фильтра, а таблица перерисовывается с новыми, отфильтрованными результатами.Как сбросить разбиение на страницы в JQuery datatable

Проблема заключается в том, что палки для папок расположены, даже если в таблице больше нет предметов для достижения текущей страницы. Поэтому, если в таблице первоначально было 20 элементов, а пользователь был на странице 2 (10 элементов на странице), и они меняют фильтр, поэтому возвращается только 5 элементов, таблица не отображает никаких элементов и показывает это внизу:

Showing 11 to 5 of 5 entries

Это все еще на странице 2, хотя для одной страницы достаточно данных.

Я нашел множество сообщений о попытке сохранить текущую страницу/строку, но ни один из них не показывает простой способ сбросить разбиение на страницы на первую страницу. Каков самый простой способ сделать это?

Вот упрощенная версия моего кода для ясности:

$("#mytable").dataTable({ 
    bStateSave: false, 
    fnServerData: function (sSource, aoData, fnCallback) { 
     return $.ajax({ 
      type: "POST", 
      url: url, 
      data: {filter: filterValue} 
     }); 
    } 
}); 

$("#myForm").submit(function(e) { 
    table.fnReloadAjax(); 
    return false; 
});

источник

2013-09-04 JMB

Вы можете явно перейти к первой странице после перезагрузки см http://datatables.net/api#fnPageChange

$("#myForm").submit(function(e) { 
    table.fnPageChange(0); 
    table.fnReloadAjax(); 
    return false; 
});

источник

2013-09-04 20:49:17 Gigo

Ах да, это функция, которую я искал. Тем не менее, мне пришлось сначала изменить страницу, чтобы предотвратить проблемы с возвратом вызова ajax, поэтому поставьте table.fnPageChange (0) перед table.fnReloadAjax(). Благодаря! – JMB

Рад, что это сработало, я отредактировал свой ответ на самом деле, как вы сказали. – Gigo

Проблема этого решения заключается в отправке двух запросов. Один для изменения страницы и другой для перезагрузки данных. – workdreamer

Принимая решение, данное @Gigo:

$("#myForm").submit(function(e) { 
    table.fnPageChange(0); 
    table.fnReloadAjax(); 
    return false; 
});

У этой проблемы есть два запроса на сервер.

Я обнаружил, что fnPageChange делает это в первый раз.

$("#myForm").submit(function(e) { 
    table.fnPageChange(0); 
    return false; 
});

источник

2013-11-01 14:28:39 workdreamer

Это может быть решена путем реализации функций для сохранения и загрузки состояния DataTable и сброс начальной точки - пример ниже

"fnStateSave": function (oSettings, oData) { 
    localStorage.setItem('MyDataTable', JSON.stringify(oData)); 
    }, 
    "fnStateLoad": function (oSettings) { 
     var settings = JSON.parse(localStorage.getItem('MyDataTable')); 
     settings.iStart = 0; // resets to first page of results 
     return settings 
    },

В fnStateLoad вызывается, когда таблица перезагружается - например, применяется новый фильтр - пейджинг сбрасывается до начала.

fnStateSave вызывается каждый раз, когда вы получить следующую страницу результатов

Такой подход позволяет избежать затрат дополнительного запроса на сервер

источник

2016-01-20 08:51:05

Как сбросить разбиение на страницы в JQuery datatable

ответ

Смежные вопросы