Javascript Date Picker

A Javascript Date Picker is a handy way to enter a date into a field on a web form. There are lots of ways to enter dates into form fields, but having a javascript date picker helps to make sure that your users enter the data in the proper format.

It used to be that you had to enter in a date in a very specific format, like mm/dd/yy or Month day, year. But very often, a user will enter a date into a field in a way that you didn’t expect, and that can be a problem for your code.

Besides making date-entry easier for the user, a good Javascript Date Picker helps to make sure that your program gets a date formatted in the way it expects.

Unlike most other code on this page, the Javascript Date Picker code is not very short, and as a result, we can’t just show you the source code on the page. There are also several different options you might want to set, like the style of the numbers, how the date picker navigates from month to month, and how the date is ultimately stored in your code.

More importantly, there are several different and very elegant pieces of code already developed by other coders, at least one of which will be perfect for you.

So here is a list of top Javascript Date Pickers.

Monkey Physics Javascript Date Picker

http://www.monkeyphysics.com/mootools/script/2/datepicker#examples

There are two versions of this date picker: one mini and one regular size. This date picker is skinnable, so you can easily change how it looks on your page. Skins include Basic, Vista, OSX and JQuery.

jQuery Date Picker

http://jqueryui.com/demos/datepicker/

The jQuery UI Datepicker is a highly configurable plugin that adds datepicker functionality to your pages. You can customize the date format and language, restrict the selectable date ranges and add in buttons and other navigation options easily.

By default, the datepicker calendar opens in a small overlay onFocus and closes automatically onBlur or when a date is selected. For an inline calendar, simply attach the datepicker to a div or span.

The jQuery date picker allows the user to use keyboard input, too. It’s a powerful, full featured piece of code.

Unobtrusive Datepicker Widget

http://www.frequency-decoder.com/2006/10/02/unobtrusive-date-picker-widgit-update

This very interesting Javascript Datepicker is accessible using just the keyboard and requires no embedded JavaScript blocks. You’ll also find it uses no pop-up windows and is suitable for use within documents served as application/xhtml+xml.

Still, you can set multiple date formats and dividers, it’s fully skinnable with CSS, you can limit upper and lower date limits, and even disable certain specific dates.

For other Javascript Date resource, go to www.JavascriptDate.com

This entry was posted in Javascript Date Codes. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>