Отображение / скрытие групп в табуляторе

#tabulator

#табулятор

Вопрос:

Есть ли какой-либо способ показать / скрыть GroupBy? Мне нравится возможность сворачивать или разворачивать группы, но было бы неплохо свернуть / развернуть / без группировки в виде 3 вариантов.

Как я мог бы добавить кнопку для отображения / скрытия групп? Где бы я разместил код для выполнения подобной функции?

Ответ №1:

Передача ложных значений или вообще ничего в tabulator.setGroupBy() эффективно отключает группировку:

 var tabulator = new Tabulator({});
var groupBy = tabulator.options.groupBy;

disableGroupButton.addEventListener('click', function() {
  tabulator.setGroupBy();
});

enableGroupButton.addEventListener('click', function() {
  tabulator.setGroupBy(groupBy);
});
  

Чтобы развернуть / свернуть группы, вам понадобится:

 expandGroupButton.addEventListener('click', function() {
  tabulator.setGroupStartOpen(true)
  tabulator.getGroups().forEach(x => x._group.show())
});

collapseGroupButton.addEventListener('click', function() {
  tabulator.setGroupStartOpen(false)
  tabulator.getGroups().forEach(x => x._group.hide())
});
  

Обратите внимание, что производительность групп развертывания / свертывания может быть низкой, когда у вас много групп строк.

Смотрите http://tabulator.info/docs/4.4/group для получения более подробной информации.

Ответ №2:

Вы можете использовать этот код:

 $("#show-all-group").click(function(){
    table.setGroupStartOpen(true);
});
  

документация: http://tabulator.info/docs/4.2/group

Ответ №3:

Чтобы быстро развернуть (и свернуть), вы можете использовать это:

 $("#group-button").on("click", function(){
    let oldGroup = table.options.groupBy;
    table.setGroupStartOpen(!table.options.groupStartOpen);
    
    if (table.options.groupStartOpen)
        $("#group-button").text("Collapse");
     else $("#group-button").text("Expand");
    
    table.setGroupBy("some_other_field");
    table.setGroupBy(oldGroup);
});
  
  • some_other_field : Просто название поля, которое вы никогда не используете для группировки; это необходимо для того, чтобы заставить табулятор перерисовать группировки. Для этой цели я использую скрытое поле. И затем мы просто восстанавливаем старые groupBy .
  • table : Ваш объект tabulator.
  • group-button : Идентификатор свернутой (или развернутой) кнопки.

Версия табулятора: 5.2

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

1. Похоже, это хорошее решение, которое стоит попробовать. Спасибо