ui.daterange

Since 4.0

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

DateRange поддерживает все форматы даты и времени и используется для выбора временных интервалов с помощью нескольких календарей (по умолчанию их два). Подробнее читайте в описательной документации DateRange.

Инициализация

var daterange = webix.ui({
    view:"daterange",
    calendarCount:4,
    timepicker:true,
    value:{
        start: new Date(), 
        end: webix.Date.add(new Date(), 2, "month")
    }
});

С чего начать

Methods
addToRange добавляет дату в существующий диапазон
adjust подстраивает размеры компонента под размеры HTML-контейнера
attachEvent задает обработчик внутреннего события компонента
bind связывает данные компонентов
blockEvent временно блокирует вызов ВСЕХ событий вызывающего объекта
callEvent вызывает внутреннее событие компонента
define переопределяет одну или несколько настроек компонента
destructor разрушает компонент
detachEvent удаляет обработчик события (который был задан ранее методом attachEvent)
disable блокирует компонент (он становится серым, клики по нему не срабатывают)
enable делает активным ранее заблокированный компонент
getChildViews возвращает внутренние компоненты
getFormView возвращает объект формы, которой принадлежит компонент
getNode возвращает HTML-элемент компонента
getParentView возвращает родительский компонент
getTopParentView возвращает самого верхнего родителя
getValue возвращает текущее значение DateRange
hasEvent проверяет, есть ли у компонента обработчики указанного события
hide скрывает компонент
isEnabled проверяет, активен или заблокирован компонент
isVisible проверяет, виден ли компонент
mapEvent направляет события от одного компонента к другому
queryView возвращает внутренние компоненты, которые удовлетворяют указанному условию
refresh перерисовывает значение компонента DateRange
resize перерисовывает компонент после изменения размеров
setValue задает новый диапазон дат
show делает компонент видимым
unbind отменяет связывание компонентов
unblockEvent отменяет блокировку событий, которая была вызвана командой 'blockEvent'
Events
onAfterDateSelect срабатывает после того, как пользователь выбрал дату в DateRange
onBeforeDateSelect срабатывает перед тем, как пользователь выберет дату в DateRange
onBindRequest срабатывает, когда компонент готов получить данные из главного компонента
onChange срабатывает, когда пользователь меняет месяц, год или время в селекторе
onDateClear срабатывает при нажатии на кнопку 'Очистить'
onDestruct происходит, когда компонент был разрушен деструктором
onTodaySet срабатывает при нажатии на кнопку 'Сегодня'
onViewShow срабатывает, когда компонент появляется (вызов метода show())
Properties
animate определяет анимацию для показа компонента в Multiview
borderless скрывает или показывает границы компонента
button добавляет кнопку "Готово" внизу DateRange
calendar определяет конфигурацию для всех календарей в виджете
calendarCount задает количество календарей, которые будут отображаться в компоненте DateRange
calendarHeight задает высоту каждого календаря в компоненте DateRange в пикселях
container HTML-контейнер (или его ID), внутри которого компонент должен быть инициализирован
css имя CSS-класса, который будет присвоен HTML-элементу компонента, или объект со стилями
disabled блокирует или разблокирует компонент
gravity задает удельный (относительный) размер компонента
height задает высоту компонента
hidden скрывает компонент после его инициализации
icons задает видимость иконок 'Сегодня/Очистить' в DateRange
id ID компонента
maxHeight задает максимальную высоту компонента
maxWidth задает максимальную ширину компонента
minHeight задает минимальную высоту компонента
minWidth задает минимальную ширину компонента
on позволяет присоединять обработчики к внутренним событиям компонента
padding определяет пространство между границами лейаута и его содержимым
paddingX задает правый и левый отступ внутри лейаута
paddingY задает верхний и нижний отступы внутри лейаута
timepicker добавляет timepicker для выбора времени
type определяет границы и отступы в лейауте
value задает изначально выбранный диапазон дат
width задает ширину компонента
Other
$getSize возвращает текущий размер компонентов
$height текущая высота компонента
$prepareValue преобразует переданное значение в нужный для компонента формат
$setNode определяет HTML-элемент компонента
$setSize задает размеры компонента
$skin вызывается после применения скина
$view возвращает HTML-элемент компонента
$width текущая ширина компонента
config все настройки, заданные при инициализации компонента
name возвращает имя компонента (свойство только для чтения)
Наверх