← Элементы формы

Дата

Чтобы добавить элемент "Дата" в форму, вам необходимо кликнуть на выбранный пункт или перетащите его вправо, тогда справа вы увидите добавленный элемент:

Дата 1

После того, как вы добавили элемент "Дата", нажмите на иконку "Редактировать" и перед вами откроется всплывающее окно редактирования данного элемента:

Дата 2

В настройках этого элемента в поле "Формат даты" вы можете выбрать каким образом будет отображаться дата при заполнении формы, например "День-Месяц-Год" или "Год. Месяц. День". Значение и описание других полей, вы можете посмотреть здесь "Основные параметры элементов".

Дата 3

В настройках этого элемента есть поле "Цветовая тема", где вы можете выбрать стиль оформления всплывающего календаря. На данный момент доступны стили:

  • Gold(Золотой вид)
  • Matrix(в стиле фильма "Матрица")
  • Steel(Стальной цвет)
  • Win2k(в стиле виндовс)

Дата 4

Также в настройках этого элемента в поле "Язык календаря" вы можете выбрать язык отображаемого календаря:

Дата 5

В настройках параметров валидации можно активировать необходимые пункты, т.е. кликнув на пункте меню "Выводить время" или "Блокировать прошлое", будет выводится соответственно, время, и не будет возможности выбирать минувшую дату:

Дата 6

Чтобы просмотреть уже настроенную форму, кликните на иконку "Просмотр" и в вашем браузере в новой вкладке откроется форма:

Дата 7

Дата 8

Если выбрать в настройках "Отображение календаря" в виде - "Встроен прямо в форму":

Дата 9

То в режиме просмотра календарь будет иметь такой вид:

Дата 10

В параметрах валидации, если активировать чекбокс "Включить блокировку дат", то появится возможность настройки "Блокировки дат":

Дата 11

И настройка количества активных блокировок на одно и тоже время, а также интервал блокировки в минутах и указать интервал минут в поле "Шаг времени в календаре, в минутах" для отображения в календаре времени. Например, если указан интервал 30 минут, как на скрине выше, то отображение доступного времени будет иметь такой вид:

Дата 12

Если мы зададим шаг более 60 минут, то время в минутах не будет выводиться в календаре, а будет доступен выбор только выбор часов::

Дата 13

И настройка количества активных блокировок на одно и тоже время, а также интервал блокировки в минутах и указать интервал минут в поле "Шаг времени в календаре, в минутах" для отображения в календаре времени. Например, если указан интервал 30 минут, как на скрине выше, то отображение доступного времени будет иметь такой вид:

Дата 12

Если мы зададим шаг более 60 минут, то время в минутах не будет выводиться в календаре, а будет доступен выбор только выбор часов::

Дата 13


Здесь можете настроить блокирование времени, например, одно время будет доступно при интервале 60 минут, т.е. пользователь выбрав время 12:00, второй раз это время не сможет выбрать.

Более подробную информацию о настройке блокировок, можете посмотреть здесь.

Также, нажав кнопку "Настроить блокировку дат":

Дата 14

Вы можете настроить время блокировки, настроить нужно ли повторять эту блокировку и если да, то как и по каким дням, а также есть опция “Нерабочее время”.

С помощью этой опции вы можете настроить график работы. Например, можете выбрать время блокировки “Весь день” и частоту повторения “Каждую неделю” и день “Воскресенье”. Таким образом каждую неделю в субботу и воскресенье у вас будет нерабочее время и эти даты нельзя будет выбрать в календаре.

Дата 15

Таким же образом можно добавить и перерыв, для этого необходимо нажать кнопку "Добавить блокировку". Далее указать время, выбрать в списке "Повторять" каждую неделю и выбрать дни повторения:

Дата 16

Таким же образом можно добавить и перерыв, для этого необходимо нажать кнопку "Добавить блокировку". Далее указать время, выбрать в списке "Повторять" каждую неделю и выбрать дни повторения:

Дата 16


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

Дата 17

Стоить отметить, что т.к. мы выбрали одну блокировку и интервал блокировки 60 минут, то, как видно выше на изображении, время до перерыва свободно только на 12:00. Следующее время 12:05 недоступно из-за интервала времени, т.к. время 13:05 попадает в заблокированное время (добавленное время перерыва).

Также, можно проще сделать настройку выходных дней, для этого достаточно активировать чекбокс "Блокировать заданные дни" в параметрах валидации. Тогда ниже, отобразится поле "Дни для блокировки", где можно будет выбрать какие дни недели можно заблокировать:

Дата 18

Если Вы проводите запись на приобретение товара, которое можно заказать с учётом доставки через 3 дня и период заказа товара 1 месяц и 7 дней, то можно вывести только те даты, на которые можно будет записаться, а все остальные заблокировать. Для этого, в параметрах валидации, необходимо активировать чекбокс "Выводить заданный интервал дат" и ниже отобразится настройка "Интервал дат":

Дата 19

Где можно задать в полях минимальную и максимальную даты в соответствующих полях. В настройка этих полей можно указать определённые значения и можно настраивать и динамические даты. Для этого нужно использовать специальные фразы:

  • now - выводит текущую дату
  • 5 days - выводит дату с таким расчетом: текущая дата плюс 5 дней
  • -5 days - текущая дата минус 5 дней
  • 2 weeks - текущая дата плюс 2 недели
  • 1 month - текущая дата плюс 1 месяц
  • 1 year - текущая дата плюс 1 год
  • 2 months 5 days - текущая дата плюс 2 месяца и 5 дней

Если мы зададим, как выше на скрине динамические значения дат, то у нас будет доступен только выбор даты и времени в период: от текущей даты плюс дня и продолжительностью, один месяц и 7 дней.

Дата 20

Стоить отметить, что т.к. мы выбрали одну блокировку и интервал блокировки 60 минут, то, как видно выше на изображении, время до перерыва свободно только на 12:00. Следующее время 12:05 недоступно из-за интервала времени, т.к. время 13:05 попадает в заблокированное время (добавленное время перерыва).

Также, можно проще сделать настройку выходных дней, для этого достаточно активировать чекбокс "Блокировать заданные дни" в параметрах валидации. Тогда ниже, отобразится поле "Дни для блокировки", где можно будет выбрать какие дни недели можно заблокировать:

Дата 18

Если Вы проводите запись на приобретение товара, которое можно заказать с учётом доставки через 3 дня и период заказа товара 1 месяц и 7 дней, то можно вывести только те даты, на которые можно будет записаться, а все остальные заблокировать. Для этого, в параметрах валидации, необходимо активировать чекбокс "Выводить заданный интервал дат" и ниже отобразится настройка "Интервал дат":

Дата 19

Где можно задать в полях минимальную и максимальную даты в соответствующих полях. В настройка этих полей можно указать определённые значения и можно настраивать и динамические даты. Для этого нужно использовать специальные фразы:

  • now - выводит текущую дату
  • 5 days - выводит дату с таким расчетом: текущая дата плюс 5 дней
  • -5 days - текущая дата минус 5 дней
  • 2 weeks - текущая дата плюс 2 недели
  • 1 month - текущая дата плюс 1 месяц
  • 1 year - текущая дата плюс 1 год
  • 2 months 5 days - текущая дата плюс 2 месяца и 5 дней

Если мы зададим, как выше на скрине динамические значения дат, то у нас будет доступен только выбор даты и времени в период: от текущей даты плюс дня и продолжительностью, один месяц и 7 дней.

Дата 20

Создай любую веб-форму
всего за 3 минуты!