Skip to content
Egor Shchapov edited this page Feb 1, 2015 · 3 revisions

The official datepicker documentation is located within the forms page at http://materializecss.com/forms.html and below are some tips.

This component is a modified version of pickdate.js but essentially most, if not all, of the original documentation applies.

Translating the date picker

To translate the text items on the date picker, just pass in a settings object, containing the translations, into your initialization. Below is a complete example.

$('.datepicker').pickadate({
  labelMonthNext: 'Next month',
  labelMonthPrev: 'Previous month',
  labelMonthSelect: 'Select a month',
  labelYearSelect: 'Select a year',
  monthsFull: [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ],
  monthsShort: [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ],
  weekdaysFull: [ 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ],
  weekdaysShort: [ 'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat' ],
  weekdaysLetter: [ 'S', 'M', 'T', 'W', 'T', 'F', 'S' ],
  today: 'Today',
  clear: 'Clear',
  close: 'Close'
});

Clone this wiki locally