Как установить пагинацию после набора данных в Табуляторе? - PullRequest
0 голосов
/ 16 июня 2020

В настоящее время я использую Tabulator эту библиотеку, и я вижу, что в do c есть метод setData(), который позволяет мне динамически устанавливать данные таблицы, однако я хочу достичь после установки данные таблицы я затем могу установить разбивку на страницы на основе этого.

Встроенная функция разбивки на страницы достигается передачей pagination:"local" объекту option или отправкой вызова ajax с использованием опции удаленной разбивки на страницы. Однако мой сценарий заключается в том, что моя клиентская сторона использует socket-io для связи со стороной сервера, и я не уверен, как это реализовать. Псевдокод может выглядеть так:

const table = new Tabulator('#my-table', {
  ...
})

socketio.subscribe({
  ...,
  callback: function(data) {
    // get data from server side
    table.setData(data)
    // how to set pagination based on that?
    // is there a method called setPagination() ?
    table.setPagination(data)
  }
})

Надеюсь, я ясно объяснил свое замешательство.

Ответы [ 2 ]

0 голосов
/ 19 июня 2020

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

Код будет:

const table = new Tabulator("#example-table", {
  // set pagination mode in local
  pagination: "local",
  paginationSize: 5,
  ...
})

setTimeout(() => {
  // simulate async data loaded
  table.setData(data)
}, 5000)

Приведенный выше код отобразит такой эффект:

  1. Сначала рендеринг пустого таблица без данных существует, разбивка на страницы отображается, но на самом деле функциональных возможностей нет.
  2. через 5 секунд данные будут вставлены в таблицу, разбивка на страницы будет повторно отрисована с полной функциональностью.
0 голосов
/ 16 июня 2020

http://tabulator.info/docs/4.6/page

Вы ищете table.setPage (3) ;. Или любой другой номер страницы.

...