Available only in PRO Edition

Фиксирование строк в DataTable

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

Чтобы зафиксировать строки, используйте параметр topSplit, в котором укажите количество строк, которые хотите зафиксировать.

webix.ui({
    view:"datatable",
    ...
    topSplit:2, // будут закреплены 2 строки сверху
});

Related sample: Frozen Top Rows

Динамическое фиксирование строк

Если вы хотите зафиксировать строку и поместить ее сверху зафиксированного блока, используйте метод freezeRow. Передайте методу два параметра:

id - (number/string) - ID строки
state - (boolean) - true - перемещает строку в зафиксированный блок

$$("grid").freezeRow(id, true);

Если вы хотите "освободить" строки, задайте методу freezeRow() значение false:

$$("grid").freezeRow(id, false);

Related sample: Freeze Row on the Fly

Сортировка и фильтрация с закрепленными строками

Зафиксированные строки игнорируют сортировку и фильтрацию. Это означает, что данные зафиксированных строк исключаются из сортировки и фильтрации.

Внешний вид закрепленных строк

Вы можете настраивать внешний вид зафиксированных строк. Каждая строка в зафиксированном состоянии содержит CSS класс webix_topcell. Вы можете переопределить нужный атрибут внутри него.

.webix_topcell {
    background: #e7f6ff;
}

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

Вы также можете изменить стиль выделения строк:

.webix_cell.webix_topcell.webix_row_select{
    background: #6d89d8;
}

Наверх

If you have not checked yet, be sure to visit site of our main product Webix lightweight js framework and page of download datatable product.