Виджет "Двусторонний список 'Шаттл'" (с поддержкой тем)
Можно использовать виджет "Двусторонний список 'Шаттл'", чтобы выбрать элементы из существующего исходного списка и поместить их в новый целевой список. В целевом списке пользователь может упорядочить выбранные элементы и удалить ненужные элементы из исходного списка.
 |
Виджет "Двусторонний список "Шаттл" доступен как стандартный виджет в платформе и как веб-компонент, который можно импортировать из SDK.
|
Формат данных
Можно конфигурировать элементы виджета ListShuttle, используя данные из таблицы данных, отформатированной с использованием следующей структуры:
|
Определение поля
|
Отображаемое поле
|
IDField
|
|---|---|---|
|
Описание
|
Представляет метку элемента списка во время выполнения.
|
Представляет фактический идентификатор элемента списка. Это значение также сохраняется в свойстве SelectedItems.
|
|
Базовый тип
|
STRING или NUMBER
|
STRING или NUMBER
|
Определение элементов списка
Чтобы определить элементы списка, привяжите таблицу данных, форматированную с требуемым форматом данных.
1. На панели Данные добавьте сервис данных, который определяет элементы списка для виджета. Можно определить элементы, используя формат таблицы данных, который приведен в предыдущем разделе.
2. Привяжите свойство All Data сервиса данных к свойству Data виджета "Двусторонний список "Шаттл".
3. На панели Свойства выберите поле таблицы данных для каждого из следующих свойств:
◦ DisplayField - данные для меток элементов.
◦ IDField - идентификатор для элементов.
4. Щелкните Сохранить, а затем щелкните Просмотр мэшапа.
Элементы списка отображаются в виджете во время выполнения.
Проверка числа выбранных элементов
В ThingWorx 9.4 или более поздней версии можно использовать свойство NumberOfSelectedItems для отслеживания и проверки числа выбранных элементов в списке во время выполнения. Например, можно привязать свойство к функции "Валидатор". Можно также показать сообщение об ошибке и ограничить сохранение страницы пользователем, если число выбранных элементов не соответствует указанному значению.
В следующем примере показана привязка между свойством и функцией "Валидатор". Событие SelectedItemsChanged используется для проверки свойства NumberOfSelectedItems с помощью функции. Во время выполнения функция проверяет число выбранных элементов и выводит сообщение об ошибке при сбое проверки.
Свойства виджета:
Имя свойства | Описание | Базовый тип | Значение по умолчанию | Доступно для привязки? (Д/Н) | Локализуемое? (Д/Н) | ||
|---|---|---|---|---|---|---|---|
TabSequence | Задает последовательность, в которой виджет подсвечивается при нажатии клавиши TAB. | NUMBER | Н/Д | Н | Н | ||
DisplayField | Поле таблицы данных, представляющее значение данных. | INFOTABLE | Н/Д | Н | Н | ||
ListFormat | Применяет конкретный рендерер для отображаемых данных. В ThingWorx 9.1 и более поздних версиях можно использовать это свойство, чтобы применить к виджету форматирование состояния. | Рендерер и форматирование состояния | Н/Д | Н | Н | ||
Disabled | Отключает виджет в мэшапе. Виджет отображается, но недоступен для использования. | BOOLEAN | false | Д | Н | ||
CustomClass | Определяет имя класса CSS для верхнего элемента div виджета. При вводе нескольких классов отделяйте каждый класс пробелом. | STRING | Н/Д | Д | Н | ||
SelectedItems | Источник таблицы данных для элементов, выбранных в списке. | INFOTABLE | Н/Д | Д | Н | ||
SingleSelect | Задает одиночный выбор или множественный выбор. | BOOLEAN | false | Д | Н | ||
HideFilter | Показывает или скрывает фильтр в исходном списке. | BOOLEAN | false | Д | Н | ||
IDField | Поле таблицы данных, содержащее идентификаторы элементов списка. Если элементы имеют одно и то же отображаемое имя, необходимо задать поле идентификатора.
| Имена полей | Н/Д | Н/Д | Н | ||
Data | Источник данных для виджета. | INFOTABLE | Н/Д | Д | Н | ||
ListShuttleLabel | Текст, отображаемый в метке виджета "Двусторонний список "Шаттл" | STRING | Двусторонний список "Шаттл" | Д | Д | ||
ListShuttleLabelAlignment | Выравнивает в виджете метку Слева, Справа или По центру. | STRING | Слева | Д | Н | ||
ListShuttleLabelType | Задает тип метки как Заголовок, Подзаголовок, Метка или Основной текст. | STRING | Подзаголовок | Д | Н | ||
NumberOfSelectedItems | Возвращает число выбранных элементов в List Shuttle.
| NUMBER | Н/Д | Д | Н | ||
SourceListLabel | Текст, отображаемый в метке исходного списка. | STRING | [Источник] | Д | Д | ||
SourceListLabelAlignment | Выравнивает в списке источников метку Слева, Справа или По центру. | STRING | Слева | Д | Н | ||
SourceListLabelType | Задает тип метки как Заголовок, Подзаголовок, Метка или Основной текст. | STRING | Метка | Д | Н | ||
TargetListLabel | Текст, отображаемый в метке целевого списка. | STRING | Цель | Д | Д | ||
TargetListLabelAlignment | Выравнивает в списке целей метку Слева, Справа или По центру. | STRING | Слева | Д | Н | ||
TargetListLabelType | Задает тип метки как Заголовок, Подзаголовок, Метка или Основной текст. | STRING | Метка | Д | Н | ||
ResetToDefaultValue | Восстанавливает в списках значения по умолчанию. | Н/Д | Н/Д | Д | Н |
Свойства проверки
| | Следующие свойства проверки для виджета "Двусторонний список "Шаттл" доступны только в ThingWorx 9.4 и более поздних версий. |
В дополнение к общим свойствам проверки можно использовать свойства TargetListMaxItems и TargetListMinItems, чтобы ограничить число выбранных элементов в виджете. Если число выбранных элементов выходит за пределы диапазона, отображается сообщение об ошибке.
Имя свойства | Описание | Базовый тип | Значение по умолчанию | Доступно для привязки? (Д/Н) | Локализуемое? (Д/Н) |
|---|---|---|---|---|---|
ValidationState | Связываемое свойство, которое задает состояние проверки. Можно задать это свойство как неопределенное, непроверенное, допустимое или недопустимое. | STRING | Undefined | Внутр. | Н |
ValidationOutput | Доступное для связывания свойство, используемое для загрузки выходных данных проверки виджета. Возвращаемыми значениями являются undefined (неопределенное), unvalidated (непроверенное), valid (допустимое) или invalid (недопустимое). | STRING | Н/Д | Внешн. | Н |
ValueRequired | Требуется добавить элемент в список целей. | BOOLEAN | False | Внутр. | Н |
RequiredMessage | Сообщение, которое отображается, если для ValueRequired задано значение true и элемент не добавлен в список целей. | STRING | Требуется выбор | Внутр. | Д |
Validate | Событие, которое инициируется при изменении значения виджета. Привяжите это событие к сервису или функции, чтобы применить выражение проверки. | EVENT | Н/Д | Внешн. | Н |
ShowValidationSuccess | Показывать сообщение об успешном завершении проверки. | BOOLEAN | False | Внутр. | Н |
ValidationSuccessIcon | Выбор значка SVG для отображения в сообщении о состоянии при успешном завершении проверки. | IMAGELINK |  success | Н/Д | Н |
ShowValidationFailure | Показывать сообщение о сбое при сбое проверки. | BOOLEAN | False | Внутр. | Н |
ValidationFailureIcon | Выбор значка SVG для отображения в сообщении о состоянии при сбое проверки. | IMAGELINK |  error | Н/Д | Н |
ShowValidationCritera | Показывает сообщение с подсказкой о необходимых входных данных при правке списка. | BOOLEAN | False | Внутр. | Н |
ValidationCriteriaIcon | Выбор значка SVG для отображения в сообщении подсказки для критериев проверки. | IMAGELINK |  Info | Н/Д | Н |
SuccessMessage | Сообщение, отображаемое при успешном завершении проверки. | STRING | Н/Д | Внутр. | Н |
SuccessMessageDetails | Дополнительное сообщение, расширяющее информацию сообщения об успешной проверке. | STRING | Н/Д | Внутр. | Д |
CriteriaMessage | Сообщение, отображаемое при сбое проверки. | STRING | Н/Д | Д | Д |
CriteriaMessageDetails | Дополнительное сообщение, расширяющее информацию сообщения о сбое. | STRING | Н/Д | Внутр. | Д |
TargetListMinItems | Задает минимальное число в списке целей. | NUMBER | Н/Д | Внутр. | Н |
TargetListMinItemsFailureMessage | Сообщение, которое отображается, если число выбранных элементов в целевом списке меньше значения TargetListMinItems. | STRING | ${value} Is the minimum number of items | Внутр. | Д |
TargetListMaxItems | Задает максимальное число элементов в целевом списке. | NUMBER | Н/Д | Внутр. | Н |
TargetListMaxItemsFailureMessage | Сообщение, которое отображается, когда число выбранных элементов в целевом списке превышает значение TargetListMaxItems . | STRING | ${value} Is the maximum number of items | Внутр. | Д |