jsDateInput

During last time we saw a lot of pages with code to assist users with date input. Usually this kind of pages uses PopUp window with calendar. It visualized date input and prevents users from date format mistakes.
Here we want to introduce our version of date input control with visual input from calendar. This control is based on JavaScript code and was tested on Netscape and IE platforms. It is fully customized through CSS file. Fill free to mail us any questions. Our email address: contact@web4w3.com

This is an working example. Take your time to play.

Date Input (USA) :

Implementation

• Take ZIP file from here.
• Unzip JavaScript code and Style files into WWW directory.
• Add to HTML page header next two lines for JavaScript and Cascading Style Sheets:
  

  	<link rel="stylesheet"  
  	href="calendar.css" type="text/css"/>
  	

  and

  	<script language="JavaScript" 
  	src="calendar.js" type="text/javascript"/>
  	

• In an input form add the text input control with onMouseOver event assigned to "getDate(this)". We recommend to mark this control as readonly to prevent users mistake.
  

  	<input 
  	name="input_date" type="text" 
  	size="10" maxlength="10" 
  	id="input_date" readonly 
  	onMouseOver="getDate(this);"/>
  	

• Enjoy
• Check this: JavaScript input components with PopUp hints.
  • jsDateInput : date input with PopUp calendar.
  • jsTimeInput : time input with PopUp hint.
  • jsCurrencyInput : currency input with PopUp calculator.

Web4W3 team