Работа с Main.Ui.Grid

В MainUiGrid две основные части - Фильтр и Таблица.

Работает так:

• при выставлении фильтра улетает ajax, значения фильтра записываются в базу
• выставленные значения обратно не прилетают
• после того как ответ прилетел, табличная часть запускает ajax на самообновление
• на бекенде читаются значения из базы данных, данные фильтруются согласно установленным фильтрам
• выбранные данные возвращаются в ответе, таблица самообновляется

Параметры компонента

• GRID_ID — идентификатор для грида. Битрикс использует его для обращения к гриду на js
• HEADERS — коллекция колонок
  • id — идентификатор колонки
  • name — отображаемое значение в ячейке
  • default (boolean) — отображается ли колонка по умолчанию
• ROWS — данные

main.ui.filter

Параметры компонента

• FILTER_ID
• FILTER - коллекция полей для фильтра
• ENABLE_LABEL - отображать ли название поля (label) на форме (true/false),

Параметры фильтра:

• id — ключ поля
• name — отображаемое название поля
• type — тип поля

Типы полей

Поля обрабатываются с помощью Bitrix\Main\UI\Filter\FieldAdapter::adapt. Типы фильтров (type) можно найти там же.

list

[
    'id' => 'USERS',
    'name' => 'Пользователи',
    'type' => \Bitrix\Main\UI\Filter\FieldAdapter::LIST,
    'placeholder' => 'Непонятно, используется ли',
    'items' => [[ 123 => 'Вася', 456 => 'Петя' ]],
    'params' => ['multiple' => true],
]

Работа с гридом на фронте

• получение инстанса грида

  const gridId = 'lists_attached_crm_{id инфоблока}';
  const gridInstance = BX.Main.gridManager.getInstanceById(gridId);
  gridInstance.reload(); // обновление грида