The following example displays simple use of the datePicker component with prefilled values in the inputs (which will be automatically selected in the date picker). These values can be generated by your serverside script, the important thing to remember is to make sure they are the same format as the Date.format you choose above.
$(function() { $('.date-pick').datePicker(); });
/* 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; }