Войти

Компонент для отображения списка чекбоксов (CheckBoxList)

Общая информация

Компонент предназначен для отображения списка чек-боксов с возможностью выбора одного или нескольких из них

Компонент в стандартной услуге

Поддерживаемые экраны


Компонент может быть задействован на экране типа:

Внешний вид компонента

В услуге

В конструкторе

Структура компонента CheckBoxList

ВКУ

JSON

 

В конструкторе

Атрибут

Тип

Описание

1

Идентификатор компонента

id

string

Уникальный идентификатор компонента в JSON

2

Удобочитаемое имя компонента

      

Допускается ввод любых данных для отображения в конструкторе, однако классическим видом является s1_с1, где номера – сгенерированные идентификаторы, s – экран, c – компонент

3

Заголовок компонента

label

string

Название поля. Описывает, что пользователю необходимо ввести в отображаемое ему поле

4

Поле является обязательным для заполнения?

Принуждает к взаимодействию с компонентом 

5

Текст для показа скрытых элементов

labelShow

string

Название кнопки для разворачивания полного списка компонентов

6

Текст для скрытия элементов

labelHide

string

Название кнопки для скрытия части списка

7

Подсказка под заголовком компонента

labelHint

 string

Подсказка под наименованием компонента. Например, «Выберите один или несколько вариантов»

8

Ограничение количества возможных для выбора элементов

limit

number

Максимальное количество «галочек», которые можно поставить

9

Ключ

***Checkbox

object

id чек-бокса. Идентификатор обязательно должен начинаться с буквы

10

Заголовок элемента

label

string

 Текст наименования чек-бокса

11

Значение чекбокса по умолчанию 

value

boolean

Определяет, в каком положении будет чек-бокс по умолчанию: с «флажком» или без 

12

Отображать чекбокс, если блок с другими элементами скрыт

showOn

 boolean

Определяет, показывается ли весь чек-бокс сразу или только после нажатия «Показать больше»

13

Установить зависимости с ранее введенными данными

ref

array of objects

Массив объектов, в элементах которых описываются зависимости и правила отображения полей

Пример JSON структуры компонента передаваемой в DTO

{

     "disabled": false,

     "value": {

     "CheckBox1": true,

     "CheckBox2": true,

     "CheckBox3": false,

     "CheckBox4": false,

     "CheckBox5": false,

     "CheckBox6": false

      },

"visited": true

}

Варианты использования

Данный компонент можно использовать для реализации механизма скрытия/отображения других компонентов на форме. Для этого необходимо в расширенном режиме настройки компонента в блоке «Установить зависимости с ранее введёнными данными» указать соответствующую взаимосвязь с действие. В данном случае с displayOn/displayOff.

Компонент в услуге Робота Макса

Поддерживаемые экраны

Компонент может быть задействован на экране типа:

  • Составной экран (CUSTOM)

Внешний вид компонента

В услуге Робота Макса

В услуге.png

В конструкторе

В конструкторе.png

Структура компонента CheckBoxList

ВКУ

JSON

 

В конструкторе

Атрибут

Тип

Описание

1

Идентификатор компонента

id

string

Уникальный идентификатор компонента в JSON

2

Удобочитаемое имя компонента

  name string

Допускается ввод любых данных для отображения в конструкторе, однако классическим видом является s1_с1, где номера – сгенерированные идентификаторы, s – экран, c – компонент

3

Заголовок компонента

label

string

Название поля. Описывает, что пользователю необходимо ввести в отображаемое ему поле

4

Поле является обязательным для заполнения?

Принуждает к взаимодействию с компонентом 

5

Ограничение количества возможных для выбора элементов

limit

number

Максимальное количество «галочек», которые можно поставить

6

Ключ

***Checkbox

object

id чек-бокса. Идентификатор обязательно должен начинаться с буквы

7

Заголовок элемента

label

string

 Текст наименования чек-бокса

8

Значение чекбокса по умолчанию 

value

boolean

Определяет, в каком положении будет чек-бокс по умолчанию: с «флажком» или без 

Пример JSON структуры компонента передаваемой в DTO

{

     "value": {

     "CheckBox1": true,

     "CheckBox2": true,

     "CheckBox3": false,

     "CheckBox4": false,

     "CheckBox5": false,

     "CheckBox6": false

      },

"visited": true

}

Авторизуйтесь, чтобы оставить комментарий к статье