Datepicker

The Datepicker control lets users select a date in a ribbon. The sections below show how to add and customize the control.

Add Datepicker

Use the add() method of TreeCollection to add a Datepicker control to a ribbon:

ribbon.data.add({
    type: "datePicker"
});

Check the list of properties that you can set in the configuration object of a Datepicker control.

Use the icon property to add an icon to a Datepicker control:

{
    type: "datePicker",
    icon: "dxi dxi-calendar-today",
}

The show() and hide() methods of Ribbon show and hide a Datepicker control by its ID:

ribbon.show(id);
ribbon.hide(id);

The enable() and disable() methods enable and disable a Datepicker control by its ID:

ribbon.enable(id);
ribbon.disable(id);