Разработка > UI > Таблицы > Публичная часть

Редактор GitHub

Работа в публичной части

Table of Contents

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

Получение объекта грида

Поскольку на странице может быть несколько таблиц точкой входа в гриды является менеджер гридов (BX.Main.gridManager), который выполняет верхне-уровневую работу над самими гридами. При помощи менеджера можно получить текущие гриды, обновить грид или вовсе удалить.

Некоторые полезные методы:

  1. Получить инстанс грида по его ID
let grid = BX.Main.gridManager.getInstanceById('OUR_GRID_UNIQUE_ID');
  1. Получить номер грида в списке (удобно для проверки существования):
/**
 * @type int|null
 */
let gridNumber = BX.Main.gridManager.getInstanceById('OUR_GRID_UNIQUE_ID');
  1. Получить все гриды на странице:
/**
 * @type array
 */
let gridList = BX.Main.gridManager.data;
  1. Обновить данные грида:
BX.Main.gridManager.reload('OUR_GRID_UNIQUE_ID');

Попытается получить инстанс грида (getInstanceById) и в случае успеха выполнит reload метод. Принимает вторым параметром url на который будет выполнена отправка данных

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

Работа с гридом

Строка добавления

В случае, когда грид доступен для редактирования существует возможность добавить строчку для inline-добавления записи.

Добавление редактируемой строки в начало списка:

grid.prependRowEditor();

Добавление редактируемой строки в конец списка:

grid.appendRowEditor();

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

Вывести прелоадер

Иногда бывает полезным заблокировать работу грида выведя прелоадер. Для управления прелоадером используются методы tableFade и tableUnfade:

grid.tableFade();

Получить идентификаторы отмеченных строк

Получить идентификаторы выбранных строк можно через rows объект:

grid.getRows().getSelectedIds(); // []

Через метод grid.getRows().getSelected(false) можно так же получить и объекты самих строк.

В случае если на форме есть чек-бокс “Для всех”, иногда бывает необходимость получить выбрал ли пользовать это значение:

grid.getRows().isAllSelected();

Снять/поставить выделение со строк

Для того чтобы снять выделение со строк, можно использовать метод unselectAll на строках

grid.getRows().unselectAll()

Поставить выделение для строк можно аналогично через grid.getRows().selectAll(). Однако стоит помнить что операция со строками и операция с чек-боксом “Для всех на странице” не обеспечиваются одним методом. Для него есть отдельные методы: grid.selectAllCheckAllCheckboxes() и grid.unselectAllCheckAllCheckboxes(), но нет необходимости работать с ними напрямую - метод grid.adjustCheckAllCheckboxes() приводит состояние этого флага в нужную позицию относительно выделенных строк на странице.

Таким образом код, снимающий выделение со строк выглядит следующим образом:

grid.getRows().unselectAll();
grid.adjustCheckAllCheckboxes();

События грида

Блокирование / Разблокирование грида

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

События Grid::disabled и Grid::enable оповещают любые другие приложения о подобных действиях. В качестве аргумента можно получить объект грида для получения необходимой информации из него.

Перед выполнением запроса

Существует особое событие исполняемое перед выполнением запросов на сервер - Grid::beforeRequest. Событие позволяет получить доступ к 2 объектам - инстансу грида и объекту настроек запроса.

Объект настроек представляет собой js-объект вида:

{
    data: {
        apply_filter: "Y",
        clear_nav: "Y"
    },
    gridId: "CRM_LEAD_LIST_V12",
    method: "POST",
    url: ""
}

Опционально есть еще один параметр - cancelRequest (bool) - если он передан и является истиной, то запрос не будет выполнен. В случае если url-параметр будет заполнен и не пустой, то именно этот url будет использован для отправки данных.

Важный момент: если вы помещаете грид на страницу через AJAX, т.е. в отложенном виде, то определенные механики грида работать не будут (постраничная навигация, настройки грида, количество элементов на страницу и другие). Это связано с тем что помещенный на страницу грид будет иметь не тот url, точнее фактически там не находиться. При работе с таким lazy-гридом необходимо явно определять событие и проверять gridId для модификации url.