jquery.datePicker example: date format

< date picker home

The following example shows how you can override the Date.format and Date.firstDayOfWeek to make the date picker behave as expected in your locale. Date.firstDayOfWeek should be set to a number between 0 (Sunday) and 6 (Saturday)

Test date picker form

Page sourcecode

Date.firstDayOfWeek = 0;
Date.format = 'mm/dd/yyyy';
$(function()
{
	$('.date-pick').datePicker()
});

Page CSS

/* 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;
}