Ajax-вызов Paginationjs игнорирует значение текстового поля для целей фильтрации - PullRequest
Новая
       6

Ajax-вызов Paginationjs игнорирует значение текстового поля для целей фильтрации

0 голосов
/ 03 ноября 2019

У меня запущен плагин jQuery под названием Paginationjs. Подчеркивание также задействовано, но на самом деле это не то, о чем этот пост.

Я хочу добавить текстовый фильтр, чтобы сервер мог фильтровать перед отправкой ответа. Вот код: 

$(function() {
    $('#pagination-container').pagination({
        dataSource: 'pagination/api',
        locator: 'data',
        totalNumberLocator: function(response) {
            // you can return totalNumber by analyzing response content
            return response.totalAmount;
        },
        alias: {
            pageNumber: 'pageNum',
            pageSize: 'limit'
        },
        pageSize: 5,
        ajax: {
            url : 'pagination/api',
            data: {
                filter : $('#filter').val()
            }
        },
        callback: function(data, pagination) {              
            var template = _.template($('#template-demo').html());
            var html = template({data: data});

            $('#data-container').html(html);
        }
    });
});

Всякий раз, когда я меняю страницу, вызывается ajax-вызов, с фильтром параметров, pageNum и limit, прикрепленным к URL-адресу.

Значение фильтра в этом URL-адресеостается неизменным при изменении страницы: Пусто. Даже когда я набираю вещи в этом текстовом поле с идентификатором «фильтр», он все равно остается пустым.

Этот плагин требует установки, называемой набором данных, поэтому я вынужден использовать URL-адрес там, а также внутри ajax. -setting под названием url.

Интересный факт: когда я что-то ввел в это текстовое поле и нажал F5 в Firefox, браузер сохраняет этот контент в этом поле после обновления, и введенное значение отправляется на сервер,Затем устанавливается значение для параметра URL «фильтр». Но, тем не менее, когда я изменяю значение и меняю страницы, оно остается тем же значением после обновления сайта.

Есть ли обходной путь для достижения этой цели?

PS: я не смогиспользуйте тег paginationjs, потому что моя репутация ниже 1500.

1 Ответ

0 голосов
/ 04 ноября 2019

Итак, поскольку Paginationjs инициализировал все URL-адреса в фоновом режиме без возможности изменить его так, как показано в моем коде выше, вот решение.

Я добавил кнопку для повторной инициализации Paginationjs один разэто щелкнуло. Таким образом, мне не нужно использовать Keypress-Event для отправки бесчисленных ajax-запросов на сервер. Я также изменил идентификатор текстового поля.

При его повторной инициализации значение фильтра связывается со значением в параметре dataSource. Настройки Ajax больше не нужны. 

$(function() {
    var paginationSettings = {
        dataSource: 'pagination/api',
        locator: 'data',
        pageSize: 5,
        totalNumberLocator: function(response) {
            return response.totalAmount;
        },
        alias: {
            pageNumber: 'pageNum',
            pageSize: 'limit'
        },
        callback: function(data, pagination) {              
            var template = _.template($('#template-demo').html());
            var html = template({data: data});

            $('#data-container').html(html);
        }
    }

    $('#pagination-container').pagination(paginationSettings);

    $('#filter-button').click(function() {
        paginationSettings.dataSource = 'pagination/api?filter=' + $('#filter-text').val();
        $('#pagination-container').pagination(paginationSettings);
    });
});
...