Pickers

Pickers provide a simple way to select a single value from a pre-determined set.

info_outline Only date pickers have been implemented at this moment.

Date Pickers

Date Pickers

Usage

Use .datepicker-adv to apply material date picker styles, then activate the datepicker via simple javascript, for example: $('#selector').datepicker();

<input class="datepicker-adv form-control" id="selector" type="text">

$('#selector').datepicker();

Options

Alternatively, options can be passed to override some default date picker settings:

  • disable to disable a specific or arbitrary set of dates selectable on the picker
  • format to change date format
  • max to set the maximum selectable dates on the picker
  • min to set the minimum selectable dates on the picker
  • selectMonths and selectYears to hide/show dropdown menus for picking month and year. The number of years to be shown in the dropdown can also be specified using an even integer.

For detailed usage of these options, please visit pickadate.js documentation siteopen_in_new.

<input class="datepicker-adv form-control" id="selector" type="text" value="01-Jan-2010">

$('#selector').datepicker({
    format: "dd-mmm-yyyy",
    selectMonths: true,
    selectYears: 30
});
Linksappsclose