Date#
Для настройки виджета требуется совершить следующие действия:
Виджет Date отображает поле для ввода даты Пользователем, что позволяет использовать подсказки и ограничения, для ввода только верных значений.
Для настройки элемента нажмите на значок редактирования .
Откроется всплывающее окно “Настройки элемента”:
Поля для настройки виджета#
Заполните нужные поля для настройки виджета.
“Обязательный к заполнению” – чекбокс, заполняется вручную левой кнопкой мыши. Предназначен для окраса поля в красный цвет, если Пользователь не заполнил данный виджет.
“Видимое название” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать название для виджета.
“Имя Параметра в Задаче (Task)” – текстовое поле, заполняется вручную с клавиатуры. В этом поле отображается текст, который соответствует значению указанного Параметра выбранной Задачи. Пользователь может изменить это значение в текстовом поле, и после сохранения формы новое значение будет записано в указанный Параметр выбранной Задачи. Это означает, что при внесении изменений в текстовое поле Пользователь может обновить информацию в Задаче, для чего достаточно просто ввести новое значение и сохранить изменения.
“Заполнитель” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать текст-заполнитель (placeholder), который будет отображаться в поле ввода до тех пор, пока пользователь не начнет вводить значение.
“Класс” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать CSS-класс, который будет применяться к элементу. Это позволяет изменить стиль виджета, например, цвет, размер или шрифт.
“Регулярное выражение (Regexp)” – текстовое поле, заполняется вручную с клавиатуры. Позволяет задать регулярное выражение для валидации ввода.
“Подсказка об ошибке валидации” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать текст, который будет отображаться Пользователю в случае, если введенное значение не прошло валидацию.
“Подсказка” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать дополнительную подсказку, которая поможет пользователю понять, что именно нужно вводить.
“Значение по умолчанию” – текстовое поле, заполняется вручную с клавиатуры. Позволяет указать значение, которое будет отображаться в поле ввода по умолчанию.
Пример заполнения#
| Название поля | Значение |
| Чек бокс "Обязательный к заполнению" | |
| Видимое название | Выберите дату |
| Имя Параметра в Задаче (Task) | event_date |
| Заполнитель | ДД.ММ.ГГГГ |
| Класс | input-date |
| Регулярное выражение (Regexp) | ^(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[0-2])\.(\d{4})$ |
| Подсказка об ошибке валидации | Пожалуйста, выберите дату между 01.01.2023 и 31.12.2023. |
| Подсказка | Выберите важную дату для вашего события. |
| Значение по умолчанию | 2023-06-01 |
Результат:
Пример выбора даты#
- Выбор даты с помощью всплывающего календаря. Позволяет Пользователю выбрать дату из интерактивного графического интерфейса.
Пользователь может переходить между месяцами и годами, используя стрелки или выпадающие списки, чтобы выбрать нужный месяц и год.
Кликнув по конкретной дате в календаре, пользователь автоматически заполняет поле ввода даты выбранным значением.
- Выбор даты с помощью ручного ввода с клавиатуры. Пользователь нажимает на поле ввода и начинает вводить дату в установленном формате.
При уходе курсора с поля или при попытке отправить форму система проверяет, соответствует ли введенная дата регулярному выражению или установленным правилам.