Creating a Simple Date Picker with JavaScript and CSS
(Page 1 of 4 )
Getting visitors to fill out certain parts of forms can be tricky, especially when the item you want them to fill out can be rendered in many different formats. Consider how many different ways one can write a date, for instance. In this first part of a two-part article, you will learn how to build a date picker that minimizes this headache.
A
downloadable zip file is available for this article.
Internet forms are a chore; every time you want to join a forum, or buy something from a site, or even download something from some sites you face the exciting prospect of yet another form to complete, and they're getting longer. I'm sure of it. Sometimes it's enough to put me off doing whatever it is I wanted to do and go someplace else instead. Anything that makes forms easier to fill out is a plus, for me and for many other surfers like me.
Any site that accepts data through forms is going to want that data to be entered in a particular format and with a particular structure. Ensuring that this happens means validating the data entered by the user. One thing that it can be cumbersome to validate is dates, not because they're particularly difficult in themselves, but because there are so many formats that people use to specify dates.
One way of making your forms easier for visitors to complete and therefore not so tiresome, as well as ensuring all of your dates come into the server in the preferred format, is to include a date picker next to any fields that require a date to be entered. With just a bit of client-side JavaScript and a little CSS, you can quickly code an attractive addition to your forms that saves time for everyone. All you'll need to follow this article is a plain old text editor.
Next: An Example Form >>
More Style Sheets Articles
More By Dan Wellman
/ 16 
