Validating that Start Date is less than End Date

[tayorolls]

Hi,

I have 2 textboxes. One for the start date and one for the end date. When the End date is entered, I would like to validate that the end date is greater than the start date. This is what I have so far. I get the error:

Object does not support this property or method in line 11.

Javascript:

/***************************************************************************
This function ensures that date from the Input box is parsed to a Java Date Object.
*****************************************************************************/

function ParseDate(dateString)
{
	//Date is in the format of mm/dd/yyyy pulled from textbox.
   var dateSep = "/";
   //firstSep = dateString.indexOf(dateSep);
   //lastSep = dateString.lastIndexOf(dateSep);
   date = dateString.split(dateSep, 3);
   //alert(date[0] + ", " + date[1] + ", " + date[2]);
   var date = new Date(date[2], date[0]-1, date[1]);
   //alert(date); //parsing is working fine. returns the date object.
   return date;
}

/*******************************************************************************
This function ensures that the users select a start date which is less than end date
*********************************************************************************/

function ValidateDate(startDateStr, endDateStr)
{
   startDate = ParseDate(startDateStr);
   endDate = ParseDate(endDateStr);

   //alert(startDate.toString()); //here is the error - when it convert to a string it is returning funny values.
   //alert(startDate.getDate());
   if (endDate < startDate) {
     alert("Start Date should be less than End Date");
   }
   //else
   //  alert("Bad");
}

HTML Code:

<form name="frmERP" action="" method=post>

            <fieldset align="middle">
                <legend>Select Search Criteria</legend>
                <table border=0>
                	<tr >
				<td colspan="2" align="right"></td>
		        </tr>
			<tr >
				<td align="right">Start Date:</td>
		        	<td align="left"><input type="text" name="sStartDate" /></td>
		        </tr>
		        <tr>
				<td align="right">End Date:</td>
				<td align="left"><input type="text" name="sEndDate" onblur="ValidateDate(this.frmERP.sStartDate, this.frmERP.sEndDate)"/></td>
		        </tr>
		        <tr>
				<td align="right">Table Name:</td>
				<td align="left">
				<select name="sTableName">
		        		<option>--Select a table --</option>
		        		<option>PO_SYSTEM_PARAMETERS_ALL</OPTION>
		        		<option>AR_SYSTEM_PARAMETERS_ALL</option>
		        		<option>AP_SYSTEMS_PARAMETERS_ALL</option>
		        		<option>RCV_PARAMAETERS</option>
		        		<option>MTL_PARAMETERS</option>
		        		<option>All Tables</option>
		        	</select>	
				</td>
		         </tr>
		</table>
                
                <div class="input_spacer"></div>
                <input type="submit" value="Get Report"/>
            </fieldset>
            </form>

 

[kaht]

There's a few things I'd change. First, the date object is pretty smart about what you pass it. You don't have to break the string down like you're doing, the Date object constructor can do that for you (in all honesty, you can get rid of this function, because it's no less typing than just creating the Date object w/o the function):

function ParseDate(dateString)
{
    //Date is in the format of mm/dd/yyyy pulled from textbox.
   date = new Date(dateString)
   return date;
}

Second, I'm not sure why you're getting funny values when trying to alert the toString of the date objects - but a better question is why you're even doing this in the first place. It's not necessary for the function. Also, I've always had more consistent results by checking the getTime() method when comparing dates. So try applying these changes:

function ValidateDate(startDateStr, endDateStr)
{
   [gray][i]//note the absence of the ParseDate function
   //and it's still about the same amount of typing[/i][/gray]
   startDate = [!]new Date[/!](startDateStr);
   endDate = [!]new Date[/!](endDateStr);

   if (endDate.[!]getTime()[/!] < startDate[!].getTime()[/!]) {
     alert("Start Date should be less than End Date");
   }
}

-kaht

Lisa, if you don't like your job you don't strike. You just go in every day and do it really half-assed. That's the American way. - Homer Simpson

 

[tayorolls]

Thanks for the reply. Now I get another error:

<form name="frmERP" action="" method=post>

            <fieldset align="middle">
                <legend>Select Search Criteria</legend>
                <table border=0>
                	<tr >
				<td colspan="2" align="right"></td>
		        </tr>
			<tr >
				<td align="right">Start Date:</td>
		        	<td align="left"><input type="text" name="sStartDate" /></td>
		        </tr>
		        <tr>
				<td align="right">End Date:</td>
				<td align="left"><input type="text" name="sEndDate" onblur="ValidateDate(document.sStartDate.value, document.sEndDate.value)"/></td>
		        </tr>
		        <tr>
				<td align="right">Table Name:</td>
				<td align="left">
				<select name="sTableName">
		        		<option>--Select a table --</option>
		        		<option>PO_SYSTEM_PARAMETERS_ALL</OPTION>
		        		<option>AR_SYSTEM_PARAMETERS_ALL</option>
		        		<option>AP_SYSTEMS_PARAMETERS_ALL</option>
		        		<option>RCV_PARAMAETERS</option>
		        		<option>MTL_PARAMETERS</option>
		        		<option>All Tables</option>
		        	</select>	
				</td>
		         </tr>
		</table>
                
                <div class="input_spacer"></div>
                <input type="submit" value="Get Report"/>
            </fieldset>
            </form>

Script does not recognize the name of sStartDate and sEndDate.

I get the error -

document.sStartDate.value is null or not an object.

Thanks.

 

[adam0101]

Try document[red].frmERP[/red].sStartDate.value
Same for the end date.

Adam

http://adameslinger.blogspot.com/

 

[monksnake]

Reference them like this:

document.forms["frmERP"].elements["sStartDate"].value
document.forms["frmERP"].elements["sEndDate"].value

In order to reference those elements by name and since they are in a form, you have to use the form name in the reference.

<.

 

[kaht]

That's because you're not referencing your elements correctly. Give each element an id and reference them with the standards compliant getElementById:

<form name="frmERP" action="" method=post>

            <fieldset align="middle">
                <legend>Select Search Criteria</legend>
                <table border=0>
                    <tr >
                <td colspan="2" align="right"></td>
                </tr>
            <tr >
                <td align="right">Start Date:</td>
                    <td align="left"><input type="text" [!]id=[/!]"sStartDate" /></td>
                </tr>
                <tr>
                <td align="right">End Date:</td>
                <td align="left"><input type="text" [!]id=[/!]"sEndDate" onblur="ValidateDate(document.[!]getElementById("sStartDate")[/!].value, document.[!]getElementById("sEndDate")[/!].value)"/></td>
                </tr>
                <tr>
                <td align="right">Table Name:</td>
                <td align="left">
                <select name="sTableName">
                        <option>--Select a table --</option>
                        <option>PO_SYSTEM_PARAMETERS_ALL</OPTION>
                        <option>AR_SYSTEM_PARAMETERS_ALL</option>
                        <option>AP_SYSTEMS_PARAMETERS_ALL</option>
                        <option>RCV_PARAMAETERS</option>
                        <option>MTL_PARAMETERS</option>
                        <option>All Tables</option>
                    </select>    
                </td>
                 </tr>
        </table>
                
                <div class="input_spacer"></div>
                <input type="submit" value="Get Report"/>
            </fieldset>
            </form>

This is entry level javascript knowledge stuff that any javascript programmer should already know...... is this for a homework assignment?

-kaht

Lisa, if you don't like your job you don't strike. You just go in every day and do it really half-assed. That's the American way. - Homer Simpson

 

[Einstein47]

This is entry level javascript knowledge stuff that any javascript programmer should already know

You would be so surprised what "programmers" are expected to know and how many are thrown into JavaScript without being taught the basics. JavaScript gets a really bad rap because of its name and because nearly every browser supports it (in one form or another - but let's not confuse the issue).

I think the reason people come here is to learn, and this might be the only place where "the basics" are really taught. You know?

Einstein47
For best results: hand wash in cold, tumble dry low.
For not so good results: drag through puddles, pound on rocks, air dry on tree branch.
[&#91;]Starbase47.com]

 

[kaht]

I think the reason people come here is to learn

Yet, when a person asks "simple" questions that's really about the only reliable way to weed-out the students from the pros. That said, there's 2 things on each page here at TT:

Promoting, selling, recruiting and [!]student posting[/!]
are not allowed in the forums.

and

INTELLIGENT WORK FORUMS
[!]FOR COMPUTER PROFESSIONALS[/!]

These define the scope of tek-tips, and to keep the community at the level that it is we as professionals have to constantly be on the lookout for people that do not belong here. Do people come here to learn? Yes. I've learned a ton from tek-tips. Should novices come here to have the forum MVPs teach them the basics? I certainly don't think so - there's tutorials all over the net that do exactly this. Should people come here to cheat on their homework by having someone do it for them? Absolutely not. So when someone asks a question that would likely be covered on the first day of Javascript 101 I don't think I'm out of line by asking them if it's a homework posting.

-kaht

Lisa, if you don't like your job you don't strike. You just go in every day and do it really half-assed. That's the American way. - Homer Simpson

 

[tayorolls]

This is not a homework posting. I work for a medical devices company doing ASP programming. I apologize if the level of my question seemed very basic and should do more research before asking questions.

Thanks.