Бесконечная прокрутка и фильтрация данных JSON

#javascript #jquery #html #css #json

#javascript #jquery #HTML #css #json

Вопрос:

Я использовал Datatables.net недавно для отображения моих данных JSON в таблице. Я использую его, потому что у него есть панель поиска, и я могу очень легко фильтровать данные, и у него была разбивка на страницы (показаны ссылки на страницы 1, 2, 3 и т. Д.)

Мне нужно альтернативное решение для перечисления данных, которое позволяет мне фильтровать (панель поиска, которая сопоставляет текст с данными) и имеет бесконечную прокрутку. Более конкретно, прокрутка тела или контейнера div (не прокрутка внутри таблицы).

Мне не обязательно нужна «таблица», мне просто нужно иметь возможность создавать поле для каждой части данных. Если у кого-нибудь есть какие-либо решения, я хотел бы это услышать.

Комментарии:

1. почему бы не расширить таблицы данных, чтобы прокрутка вниз загружала следующую страницу?

2. @dandavis Я не хочу загружать следующую страницу, ее нужно добавить снизу. И я искал часами и не могу найти метод.

3. ах, хорошая мысль. вы можете изменить # строк, отображаемых вместо следующей страницы, затем в старой нижней строке вызвать scrollIntoView()

Ответ №1:

@dandavis помог с идеей

 var tableNumRows = 15, activeForms = $('#the_table').dataTable();

$('#pageContent').bind('scroll', function() {
    if($(this).scrollTop()   $(this).innerHeight() >= this.scrollHeight) {
        var oSettings = activeForms.fnSettings();
        tableNumRows =15;
        oSettings._iDisplayLength = tableNumRows;
        activeForms.fnDraw();
    }
});