Блок для построения строк и колонок GRID

Выберите инструмент для разработки с AI-агентом:

  • используйте Битрикс24 Вайбкод, чтобы создать приложение для Битрикс24 по описанию задачи без знания языков программирования. Агент напишет код и разместит приложение на сервере без ручной настройки хостинга
  • используйте MCP-сервер, чтобы разрабатывать интеграцию через REST API в своем проекте. Агент будет обращаться к официальной REST-документации

Блок GRID выводит данные в табличном формате пар «название — значение» с разными вариантами отображения. Подходит для карточек со свойствами: статус заявки, приоритет, ответственный, срок. Для свободного текста используйте блок MESSAGE.

Блок передается элементом массива BLOCKS вложения, а значение ключа GRID — массив элементов. Общие правила и лимиты вложения описаны на странице Вложения в сообщениях ATTACH.

Варианты отображения

Режим задается полем DISPLAY у каждого элемента.

  • BLOCK — каждый элемент выводится отдельным блоком на новой строке. Подходит для длинных значений и описаний
  • LINE — элементы выводятся в одну строку как карточки и переносятся при нехватке ширины. Подходит для коротких меток и статусов
  • ROW — две колонки: слева NAME, справа VALUE. Подходит для карточки свойств «поле — значение»
  • TABLE — значение принимается API, но веб-клиент элемент с таким режимом не выводит, а мобильное приложение показывает его как BLOCK. Вместо TABLE используйте ROW

Если DISPLAY не передан или не распознан, элемент выводится как BLOCK. Для совместимости принимаются старые значения CARD (то же, что LINE) и COLUMN (то же, что ROW).

Важно

Задавайте всем элементам одного блока GRID одинаковый DISPLAY. Клиенты по-разному выводят смешанные режимы: например, устаревший веб-интерфейс берет режим всего блока из первого элемента. Если нужны разные режимы, создайте несколько блоков GRID подряд.

Параметры элемента GRID

Название
тип

Описание

DISPLAY
string

Формат отображения: BLOCK, LINE, ROW. По умолчанию BLOCK

NAME
string

Название поля. В режиме ROW может отсутствовать, тогда VALUE занимает всю ширину строки

VALUE
string

Значение поля, поддерживает BB-коды. В режиме ROW может отсутствовать, тогда NAME занимает всю ширину строки. Элемент, у которого пусты и NAME, и VALUE, пропускается, кроме режима LINE

WIDTH
integer

Ширина блока или колонки в пикселях

HEIGHT
integer

Высота блока в пикселях. Сохраняется во вложении, но веб-клиентом не учитывается

COLOR_TOKEN
string

Токен цвета значения: primary, secondary, alert, base. По умолчанию base

COLOR
string

HEX-цвет значения (#RGB или #RRGGBB). Учитывается только устаревшим веб-интерфейсом, актуальные клиенты используют COLOR_TOKEN

LINK
string

Ссылка для значения: абсолютный URL http:// или https:// или путь от корня Битрикс24. Делает кликабельным все значение целиком. Кликабельные фрагменты внутри значения задаются BB-кодами в VALUE

USER_ID
integer

ID пользователя. Сохраняется во вложении, но переход по нему в клиентах не реализован. Для ссылки на профиль передайте в LINK путь /company/personal/user/1/

CHAT_ID
integer

ID чата. Сохраняется во вложении, но переход по нему в клиентах не реализован

BB-коды в VALUE

VALUE поддерживает тот же набор BB-кодов, что блок MESSAGE, с теми же различиями между веб-клиентом и мобильным приложением.

Пример элемента со значением-упоминанием: {"DISPLAY": "ROW", "NAME": "Исполнитель", "VALUE": "[USER=1]Иван Иванов[/USER]"}.

Примеры

Как использовать примеры в документации

Примеры показывают один элемент массива BLOCKS.

Блочное представление

DISPLAY: 'BLOCK' выводит элементы друг под другом.

Блочное представление

{
    GRID: [
        {
            NAME: 'Описание',
            VALUE: 'Требуется реализовать возможность добавлять структурированные объекты в сообщения и уведомления мессенджера.',
            DISPLAY: 'BLOCK',
            WIDTH: 250
        },
        {
            NAME: 'Категория',
            VALUE: 'Пожелания',
            DISPLAY: 'BLOCK',
            WIDTH: 100
        }
    ]
}
block = {
    "GRID": [
        {
            "NAME": "Описание",
            "VALUE": "Требуется реализовать возможность добавлять структурированные объекты в сообщения и уведомления мессенджера.",
            "DISPLAY": "BLOCK",
            "WIDTH": 250,
        },
        {
            "NAME": "Категория",
            "VALUE": "Пожелания",
            "DISPLAY": "BLOCK",
            "WIDTH": 100,
        },
    ],
}
[
    'GRID' => [
        [
            'NAME' => 'Описание',
            'VALUE' => 'Требуется реализовать возможность добавлять структурированные объекты в сообщения и уведомления мессенджера.',
            'DISPLAY' => 'BLOCK',
            'WIDTH' => 250
        ],
        [
            'NAME' => 'Категория',
            'VALUE' => 'Пожелания',
            'DISPLAY' => 'BLOCK',
            'WIDTH' => 100
        ]
    ]
]

Строчное представление

DISPLAY: 'LINE' выводит элементы в строку с переносом на следующую строку при нехватке места.

Строчное представление

В мобильной версии элементы выводятся друг под другом:

Строчное представление (mobile)

{
    GRID: [
        {
            NAME: 'Приоритет',
            VALUE: 'Высокий',
            COLOR_TOKEN: 'alert',
            DISPLAY: 'LINE',
            WIDTH: 250
        },
        {
            NAME: 'Категория',
            VALUE: 'Пожелания',
            DISPLAY: 'LINE'
        }
    ]
}
block = {
    "GRID": [
        {
            "NAME": "Приоритет",
            "VALUE": "Высокий",
            "COLOR_TOKEN": "alert",
            "DISPLAY": "LINE",
            "WIDTH": 250,
        },
        {
            "NAME": "Категория",
            "VALUE": "Пожелания",
            "DISPLAY": "LINE",
        },
    ],
}
[
    'GRID' => [
        [
            'NAME' => 'Приоритет',
            'VALUE' => 'Высокий',
            'COLOR_TOKEN' => 'alert',
            'DISPLAY' => 'LINE',
            'WIDTH' => 250
        ],
        [
            'NAME' => 'Категория',
            'VALUE' => 'Пожелания',
            'DISPLAY' => 'LINE'
        ]
    ]
]

Представление в виде двух колонок

DISPLAY: 'ROW' выводит данные в две колонки.

Построение в виде двух колонок

{
    GRID: [
        {
            NAME: 'Приоритет',
            VALUE: 'Высокий',
            DISPLAY: 'ROW'
        },
        {
            NAME: 'Категория',
            VALUE: 'Пожелания',
            DISPLAY: 'ROW'
        }
    ]
}
block = {
    "GRID": [
        {
            "NAME": "Приоритет",
            "VALUE": "Высокий",
            "DISPLAY": "ROW",
        },
        {
            "NAME": "Категория",
            "VALUE": "Пожелания",
            "DISPLAY": "ROW",
        },
    ],
}
[
    'GRID' => [
        [
            'NAME' => 'Приоритет',
            'VALUE' => 'Высокий',
            'DISPLAY' => 'ROW'
        ],
        [
            'NAME' => 'Категория',
            'VALUE' => 'Пожелания',
            'DISPLAY' => 'ROW'
        ]
    ]
]

Продолжите изучение