RichSelect
Справочник по API
Обзор
Контрол RichSelect - это нередактируемый Combo-box.
RichSelect содержит текстовое поле ввода и всплывающее окно, которое содержит стандартный список с опциями.
Еще один способ создать компонент со схожей функциональностью - это прикрепить suggest list к текстовому полю. Но текстовое поле в этом случае будет редактируемым.
Инициализация
// полная форма
{
view:"richselect",
id:"list2",
label:"richselect",
value:1,
yCount:"3",
options:[
{id:1, value:"One"}, // изначально выбранный элемент
{id:2, value:"Two"},
{id:3, value:"Three"}
]
}
// краткая форма массива опций
{view:"richselect", options:["One", "Two", "Three"]}
// опции на сервере
{ view:"richselect", options:"server/data.json"}
Related sample: Non-editable Combo Box ('richselect')
Основные свойства
- value (string, number)
- внутри массива options - определяет текстовое значение для выбираемых элементов;
- внутри конструктора richselect - определяет изначально выбранный элемент контрола (ID для длинной формы инициализации, текстовое значение для короткой формы инициализации);
- placeholder (string) - текст плейсхолдера для поля ввода. Контрол должен быть инициализирован без исходного значения;
- label (string) - задает текст ярлыка. Можно настраивать с помощью:
- labelAlign (string) - выравнивание ярлыка относительно его контейнера. Возможные значения "left" и "right". Если не задано, помещается слева от контрола;
- labelWidth (number) - ширина контейнера ярлыка;
- options (array, object, string) - определяет список опций для контрола. Подробнее.
Настройка Suggest List
Контрол можно изменять и настраивать различными способами, например:
- опции могут быть определены динамически;
- опции можно загрузить на бэке;
- темплейт можно изменять.
Вы также можете изменить конфигурацию по умолчанию для suggest list, подробнее в статье Продвинутые настройки Combo.
Доступ к Suggest List
Richselect API позволяет получать объект выпадающего окна и списка внутри него для дальнейшей обработки. Пример ниже иллюстрирует оба варианта:
$$("richselect1").getPopup(), // получение suggest
$$("richselect1").getPopup().getBody(), // получение текущего тела suggest
$$("richselect1").getPopup().getList(), // получение объекта list
$$("richselect1").getList(), // получение объекта list, быстрый способ
Pro версии Richselect
Для пользователей Webix Pro библиотека позволяет расширить возможности контрола отображением DataView или DataTable во всплывающем окне:
Получить текущее значение
Для полной формы инициализации метод getValue() вернет ID выбранной опции, но не её текст. Используйте getText(), чтобы получить текстовое значение.
$$("field_t").getValue(); // -> возвращает 1
$$("field_t").getText() // -> возвращает "One"