Автоматическая прокрутка JQuery DataTable при загрузке вниз - PullRequest
6 голосов
/ 03 апреля 2012

Я использую плагин jQuery DataTable и не могу найти способ сделать так, чтобы он прокручивался до нижней части таблицы, когда данные загружаются через AJAX.

Такбазовый макет моей страницы содержит две таблицы данных jQuery.Из проверки визуализированного кода я вижу, что плагин создаст оболочку div с идентификатором «myTableid_wrapper» с двумя дочерними элементами - заголовком и таблицей.

Теперь, если таблица запускает прокруткувозможность затем таблица будет снова обернута в другой div с переполнением: скрыто, чтобы таблицу можно было прокрутить.

Этот div имеет имя класса «dataTables_scrollBody».Вот пример таблицы, которая не активировала функцию прокрутки.

<div id="myTable1_wrapper" class="dataTables_wrapper" >
  <div id="case_activity_table_filter">no worried about this guy</div>
    <table id="myTable1" >does not matter whats in here</table>
</div>

Вот общая схема таблицы, которая активировала функцию прокрутки плагина.Как вы можете видеть, div с классом «dataTables_scrollBody» автоматически генерируется плагином.

<div id="myTable2_wrapper" class="dataTables_wrapper" >
  <div id="case_activity_table_filter">no worried about this guy</div>
  <div class="dataTables_scrollBody" style="overflow:hidden" >
    <table id="myTable2" >does not matter whats in here</table>
  </div>
</div>

Обе эти таблицы находятся на одной странице.Обе эти таблицы могут иметь или не иметь элемент прокрутки.

Есть ли способ указать целевой класс "dataTables_scrollBody" и прокрутить его вниз при создании таблицы с помощью AJAX?

Ответы [ 2 ]

8 голосов
/ 06 апреля 2012

при условии, что вы инициализировали таблицу данных следующим образом:

var oTable = jQuery('#myTable1').dataTable({
    "bProcessing": true,
    "bPaginate": false,
    "sScrollY": "200",
    "bScrollCollapse": true
});

Вы можете просто сделать:

oTable.parent().scrollTop(9999);

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

при использовании ajax вам, возможно, придется поместить код scrollTop в функцию обратного вызова "fnInitComplete", чтобы она выполнялась после рендеринга таблицы.

...

Другая идея: возможно, вы можете изменить порядок строк с помощью aaSorting, тогда вам не нужно будет выполнять прокрутку.

0 голосов
/ 11 сентября 2014

Если кто-то, как я, в конечном итоге приедет сюда, чтобы узнать, как с комфортом прокрутить таблицу данных js, я бы настоятельно рекомендовал взглянуть на библиотеку scrollTo, которая отлично справляется со своей работой:

https://github.com/flesler/jquery.scrollTo] 1

пример использования:

$('<here whole datatable>').scrollTo( '<here target eg td>', 1 );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...