Как добавить фильтры заголовков с автоколоннами? - PullRequest
Новая
       16

Как добавить фильтры заголовков с автоколоннами?

0 голосов
/ 02 апреля 2019

Я использую библиотеку табуляторов для построения таблицы с параметром autoColumns: true , поскольку столбцы динамические, это нормально, но я также хотел добавить фильтр заголовков для В каждой колонке я ссылался на документацию, но я не мог найти обходной путь. Ниже приведен код, 

init: function() {
      var _this = this;
      this.tabulator = new Tabulator("#example", {
        autoColumns:true,
        height:"500px",
        movableColumns: true,
        ajaxProgressiveLoad:"scroll",
        paginationSize:20,
        ajaxProgressiveLoadScrollMargin: 400,
        ajaxLoader: true,
        ajaxLoaderLoading: 'updating data',
        ajaxProgressiveLoadDelay: 200,
        ajaxResponse:function(url, params, response){  
          return {last_page: _this.iTotalPage, data: response}; 
        }
      });
     this.setData(); 
},

setData: function() {
  this.tabulator.setData("/tableData", {searchValue: this.sSerachValue});
},

Есть ли способ добавить фильтр заголовков, не выбирая столбцы с помощью (this.tabulator.getColumns ()) и сопоставляя каждый из них для установки функции фильтров?

1 Ответ

0 голосов
/ 06 апреля 2019

Я не знаю, будет ли это соответствовать вашим потребностям ...
Во всяком случае, предложение, просто используя методы этой великой библиотеки (которую я недавно обнаружил;) 

    // here your starting code...

        this.setData();
        this.setHeaders();
    },
    setData: function() {
        this.tabulator.setData(tableData, {});
    },
    setHeaders: function() {
        var columns = this.tabulator.getColumnDefinitions();

        // basic code to adapt to your need
        columns.forEach(column => {
            column.headerFilter = "input";
        });

        this.tabulator.setColumns(columns);
    }

Или после таблицы, построенной из кнопки, чтобы вызвать это 

document.getElementById('setHeaders').onclick = function(e) {
    var columns = object.tabulator.getColumnDefinitions();

    columns.forEach(column => {
        column.headerFilter = "input";
    });

    object.tabulator.setColumns(columns);
}
...