O'Reilly logo

jQuery UI Cookbook by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Working with different date formats

The datepicker widget supports a variety of date string formats. The date string is the value populated in the text input when the user makes a selection. More often than not, applications will try to follow the same date format throughout the UI for consistency. So if you're not happy with the default format provided by the widget, we can change it when the widget is created using the dateFormat option.

How to do it...

We'll start by creating two input fields where we require the date input from the user:

<div>
    <label for="start">Start:</label>
    <input id="start" type="text" size="30"/>
</div>

<div>
    <label for="stop">Stop:</label>
    <input id="stop" type="text" size="30"/>
</div>

Next, we'll create two datepicker ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required