-
Date validation
I'm working on a date/time control that allows a user looking at a webpage to enter a date/time.
I have finished the javascript for enforcing proper entry of a time (military or standard).
I am now working on a way to enforce a proper date.
I will be using a regular expression, however, it is quite possible that the user may enter 02/31/2003. (Feb 31 2003), in which case this really only helps me ensure the date is written in the proper format mm/dd/yyyy, not if the date is valid.
So, now, along with the regular expression, I need to write javascript that will flag the user if the date is not valid. This is really straight forward.
My main concern being, if the webpage loads to a user in Europe, I have to somehow get the culturalization of that user, and apply that to the javascript.
Any ideas?
-
I'm sure you have a valid reason for this but why don't you use the calendar control?
-
Lol....
I have few requirements that the .Net IDE calendar control would not or cannot fill:
[list=1][*]Need to have a custom control with two textboxes, one for date, one for time. (DateTimePicker)[*]The calendar appears under the datebox via client-side scripting when the user tabs(clicks into) the datebox.[*]Picking a date from the calendar does not produce a postback, rather fills the textbox with the Date selected. [*]The custom control does not initially default to a date when it loads, unless one has been set previously by the user, thereby allowing a null date value.[*]The calendar resides within a custom control alongside a textbox with client-side scripting to ensure proper entry of time, either 24hr or 12AMPM format depending on page configuration.[*]The calendar control and time textbox combine to produce a single DateTime object as a property which can then be fed to the SQL database after the page posts back.[/list=1]
If you develop an international website, a user in the US should receive the control to allow entry in mm/dd/yyyy format, whereas a user in the UK would get a control that allows entry in dd/mm/yyyy format.
The client-side script which handles validation is rendered to the page when it loads, it is unique depending on the client's culture settings.
The standard .Net IDE calendar control is a graphical interface for selecting a date, but I must allow the user to TYPE in a date as well.
I have it nailed except for globalization. I have found however, a function in JSCRIPT (not JavaScript), that will retrieve the culture-specific date in a string... so I guess I will work toward that end, unless someone has any ideas or suggestions from there.
Phew.
-
1 Attachment(s)
Here's a look at the product so far.
The calendar appears under the datebox when the user enters the databox.
Also notice the military time on the left, and standard time on the right.
So it's been a 5 day project so far... and all I have left to do is somehow change the client script for TYPING a date, to accuractly reflect the culuture-specfic date format.
-
Ok... so after a few hours... this is what I came up with.
Javascript has a .toLocaleDateString method, which converts a date into its local format. Using a seed date I can determine how the client's operating system returns the date, and use it as a regular expression to validate against on the client side when the page is loading.
Code:
function getDateRegEx()
{
globalDate = New Date(2003,12,31);
localDate = globalDate.toLocaleDateString;
//localDate now contains the seed date in the
//culture-specific format
//First we determine the date seperator /, - , or .
var seperator;
for (i=0;i<localDate.length;i++)
{
seperator = localDate.charAt(i);
if (asc(seperator) < 48 || asc(seperator) > 57)
{
//we have found the date seperator
break;
}
}
//we can determine if the local format is mm/dd or
// dd/mm by seeing which comes first in the locale string
if localDate.indexOf("12") < localDate.indexOf("31")
{
mdRegPattern = "mm" + g + "dd";
}
else
{
mdRegPattern = "dd" + g + "mm";
}
//we now determine where the year part is
if localeDate.indexOf("12") < localeDate.indexOf("2003")
{
mdRegPattern+= "yyyy";
}
else
{
mdRegPattern = "yyyy" + mdRegPattern;
}
return mdRegPattern;
} //end function