how to validate a date clientside

lcsgeek · October 2nd, 2003, 08:31 AM

Sorry kosla78,
But when I tried your script, it always returned false, no matter if the date entered was within the acceptable range or not. So I tried to enhance it a little with the following but it doesn't work either. Boy this doesn't seem like rocket science but I can't find this anywhere on the web, surly someones done clientside date validation before. Thanks for your response.

function ValiDate(oTextBox)
{
var qtrstart =new Date();
var qtrend=new Date();
var entered=new Date();
qtrstart="8/25/2003";
qtrend="10/25/2003";
entered=oTextBox.value;
if(entered < qtrstart | entered > qtrend)
{
alert("Both 'Assigned Date' and 'Due Date' must range between 8/25/2003 and 10/25/2003");
return false;
}
else
return true;
}

KenSchaefer · October 3rd, 2003, 02:41 AM

When you say "it doesn't work" - what do you mean?

Furthermore, this isn't an ASP question - surely you'd be better off asking in a javascript forum?

Cheers
Ken

Microsoft MVP - Windows Server (IIS)
www.adOpenStatic.com

pgtips · October 3rd, 2003, 03:25 AM

To me this seems a strange way to deal with dates. If you want a date object that represents 8/25/2003 why not just do var qtrstart = new Date(2003, 7, 25); (months are zero-based, but day and year are not!)

Also, there does not seem to be anything to check that oTextBox.Value actually contains a valid date. Surely you must check that first before you can even attempt to determine whether it falls within a certain date range.

I use js objects to handle validation, so although I have code to do what you want, its not easy for me to unpick it into the form you appear to need. For example, here is a snippet that checks for a valid date:

Code:

    var cYEAR = 2, cMONTH = 1, cDAY = 0; // change these for other date formats
    var sValueToTest = this.parent.getValueFromObject(this.formName, this.fieldName);
    var bOK = true;

    this.failureMessage = "";

    if (sValueToTest != null)
    {
        // attempt to convert to a date (assume dd/mm/yyyy format)
        var dtValueToTest;
        var aDate;
        try
        {
            aDate = sValueToTest.split("\/");  // change this for other date formats
            dtValueToTest = new Date(aDate[cYEAR], aDate[cMONTH] - 1, aDate[cDAY]);
            if ( isNaN(dtValueToTest) )
            {
                bOK = false;
                this.failureMessage = this.fieldFriendlyName + " must be a valid date in the format dd/mm/yyyy";
            }
        }
        catch (e)
        {
            bOK = false;
            this.failureMessage = this.fieldFriendlyName + " must be a valid date in the format dd/mm/yyyy";
        }

        // if the date conversion succeeded, check its the actual date that was input
        // (e.g. it will accept 31/2/2003 but will change it to 3/3/2003)
        if (bOK)
        {
            // is it the same year?
            if (aDate[cYEAR] != dtValueToTest.getFullYear())
                bOK = false;

            // is it the same month?
            if (aDate[cMONTH] != 1 + dtValueToTest.getMonth())
                bOK = false;

            // is it the same day?
            if (aDate[cDAY] != dtValueToTest.getDate())
                bOK = false;

            if (!bOK)
                this.failureMessage = this.fieldFriendlyName + " must be a valid date in the format dd/mm/yyyy";
        }

Are you able to modify this to fit your date format and inputs (this covers UK/Euro format dd/mm/yyyy, not US mm/dd/yyyy format)? If so, once you have confirmed that the input is a valid date, all you have to add is:
if (dtValueToTest < qtrstart || dtValueToTest > qtrend) // note the || for OR
{
alert("blah blah...");

Is this any use to you? I'll be happy to explain any parts that are not clear to you.

rgds
Phil