The following example displays simple use of the datePicker component to select a date for input fields - a startDate is passed to the date picker so that you can select dates in the past and an end date of today is passed so that only dates in the past can be selected (i.e. for date of birth selection).
$(function() { $('.date-pick').datePicker( { startDate: '01/01/1970', endDate: (new Date()).asString() } ); });
/* located in demo.css and creates a little calendar icon * instead of a text link for "Choose date" */ a.dp-choose-date { float: left; width: 16px; height: 16px; padding: 0; margin: 5px 3px 0; display: block; text-indent: -2000px; overflow: hidden; background: url(calendar.png) no-repeat; } a.dp-choose-date.dp-disabled { background-position: 0 -20px; cursor: default; } /* makes the input field shorter once the date picker code * has run (to allow space for the calendar icon */ input.dp-applied { width: 140px; float: left; }