Sunday, January 30, 2005

asp.net custom validator for mmddyy date format

This one is a usability reqt, since system is migrated form mainframe, users have long since got used to enter the date in mmddyy format without any slashes; mainframe CICS screen used to shift to next fld as current fld is filled out. And we needed to have that date textbox to accept date in this format and validate the date. {Personally, i would not prefer handling this and needs to be considered as a training reqt}

To minimize the impact to the code, (almost all times, these reqts spring up only in user acceptance stage, where you have not time think a better solution; will most probably patch the code) i added the following java script, which on tab out of text box, put the slash in approp place, but unfortunately the asp.net validator fires before this onblur event and hence fails, so i had to create a custom validator which formats and also validates the date. I am posting that useless date time patch code below,

<asp:TextBox id="TextBoxDate" runat="server" Width="65" MaxLength="8" CssClass="textbox"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidatorDate" ControlToValidate="TextboxDate" Enabled="false"
Display="Static" ErrorMessage="Date is required and must be in MMDDYY or MM/DD/YY format." Runat="server" />
<asp:CustomValidator id="CustomValidatorDateCheck" runat="server" ErrorMessage="Date or Date format is invalid. Format is MMDDYY or MM/DD/YY." ClientValidationFunction="FormatAndValidateDate" ControlToValidate="TextBoxDate" />

/*
This is having client script for formating and validating date. The following date formats are accepted:
mmddyy, mmddyyyy, mm-dd-yyyy, mm/dd/yyyy, mm.dd.yyyy, mm dd yyyy,
mmm dd yyyy, mmddyyyy, m-d-yyyy, m/d/yyyy, m.d.yyyy,
m d yyyy, mmm d yyyy, m-d-yy, m/d/yy, m.d.yy, m d yy,
mmm d yy (yy is 20yy)
*/
function FormatAndValidateDate(oSource,oArguments) {
var szDate;
var szDateArray;
var szDay;
var szMonth;
var szYear;
var bFound = false;
var aszSeparatorArray = new Array("-"," ","/",".");
var iElementNr;

oArguments.IsValid = false;
if (oArguments.Value.length < 6){
return;
}
szDate = oArguments.Value;

szDate = szDate.replace(/^\s+/,'').replace(/\s+$/,'');

var szDateFormat = new RegExp("^(\\d{1,2})([-./ ]{0,1})(\\d{1,2})\\2((\\d{4})|(\\d{2}))$");
m = szDate.match(szDateFormat);
if (m == null) {
return;
}
for (iElementNr = 0; iElementNr < aszSeparatorArray.length; iElementNr++)
{
if (szDate.indexOf(aszSeparatorArray[iElementNr]) != -1)
{
szDateArray = szDate.split(aszSeparatorArray[iElementNr]);
if (szDateArray.length != 3)
{
return;
}
else
{
szDay = szDateArray[0];
szMonth = szDateArray[1];
szYear = szDateArray[2];
}
bFound = true;
}
}

if (bFound == false)
{
if (szDate.length > 5)
{
szDay = szDate.substr(0, 2);
szMonth = szDate.substr(2, 2);
szYear = szDate.substr(4);
}
}

if(szYear != null)
{
if (szYear.length == 2)
{
szYear = '20' + szYear; //If entered 2 digit yr, consider it as 21st century
}
}

//swap for US date format mm/dd/yy
var szTmp = szDay;
szDay = szMonth;
szMonth = szTmp;

szTmp = "";

if( (szMonth<10) && (szMonth.length == 1))
{
szTmp = "0" + szMonth + "/";
}
else
{
szTmp = szMonth + "/";
}
if( (szDay<10)&& (szDay.length == 1))
{
szTmp += "0" + szDay + "/";
}
else
{
szTmp += szDay + "/";
}

document.getElementById(oSource.controltovalidate).value = szTmp + szYear.substr(2, 2);

szMonth = szMonth - 1; // javascript month range : 0- 11
var tempDate = new Date(szYear,szMonth,szDay);
if ( (typeof(tempDate) == "object") && (getYear(tempDate.getYear()) == szYear) && (szMonth == tempDate.getMonth()) && (szDay == tempDate.getDate()) )
{
oArguments.IsValid = true;
}
}
function getYear(d) {
return (d < 1000) ? d + 1900 : d;
}

No comments: