compare dates using onblur()

[Gill1978]

Hi!!

I'm trying to compare two dates that the user enters. The user enters a date in the first box (in dd/mmm/yyyy form), and then when the user leaves the box it compares the date with the date in the second box to check that the date in the first box is before the date in the second box!

Can anyone help ??


Thanks

Julie

 

[Guest_imported]

You need to create an event handler in JavaScript to validate the data. You can use either the onBlur or onChange events to invoke your event handler (there are other events for an INPUT tag, but they are not useful in this case). You would write:

<INPUT type=&quot;text&quot; name=&quot;first_date&quot; onChange=&quot;return compare_dates(this)&quot;>

&quot;Compare_dates()&quot; is a JavaScript function that is invoked when the value of the form field changes. Planning ahead, you need to think about exactly what you want to do. For example, the goals might be:
- verify that the field is not blank
- verify that the date is in the correct format
- verify that date1 is earlier than date2

But, what if compare_date() were invoked from date1 while date2 is still blank because the user hasn't filled it out yet? My suggestion is that you hold off verifying the dates until the form is submitted. That way, if you find a blank date field, you know it's an error. Instead of the code that I wrote above, you would write normal <INPUT> tags (with no event handler) and you would do this for the form:

<FORM NAME=&quot;myform&quot; ACTION=&quot;sometemplate.cfm&quot; METHOD=&quot;post&quot; onSubmit=&quot;return validate_form();&quot;>

So, here is a suggestion of how the code might go:

<SCRIPT LANGUAGE=&quot;JavaScript&quot;>
   function validate_form() {
      var date1 == document.myform.date1.value;
      var date2 == document.myform.date2.value;

      // pseudocode to verify that date1 and date2 are in correct date format.
      if (date1 is not in correct format) {
         alert(&quot;Date must be in dd/mmm/yyyy format&quot;);
         document.myform.date1.focus;
         return false
      }
      if (date2 is not in correct format) {
         alert(&quot;Date must be in dd/mmm/yyyy format&quot;);
         document.myform.date2.focus;
         return false
      }

      // pseudocode to compare dates
      if (not date1 < date2) {
         alert(&quot;Date2 must be later than Date1&quot;);
         document.myform.date2.focus;
         return false
      }

     // insert code to validate other fields

      return true;
   }
</SCRIPT>

 

[tleish]

You could do something like this:

<script language=&quot;JavaScript&quot;>
[COLOR=666666]<!--[/color]
function suycDateDiff( start, end, interval, rounding ) {

var iOut = 0;

[COLOR=666666]// Create 2 error messages, 1 for each argument. [/color]
var startMsg = &quot;Check the Start Date and End Date\n&quot;
startMsg += &quot;must be a valid date format.\n\n&quot;
startMsg += &quot;Please try again.&quot; ;

var intervalMsg = &quot;Sorry the dateAdd function only accepts\n&quot;
intervalMsg += &quot;d, h, m OR s intervals.\n\n&quot;
intervalMsg += &quot;Please try again.&quot; ;

var bufferA = Date.parse( start ) ;
var bufferB = Date.parse( end ) ;

[COLOR=666666]// check that the start parameter is a valid Date. [/color]
if ( isNaN (bufferA) || isNaN (bufferB) ) {
alert( startMsg ) ;
return null ;
}

[COLOR=666666]// check that an interval parameter was not numeric. [/color]
if ( interval.charAt == 'undefined' ) {
[COLOR=666666]// the user specified an incorrect interval, handle the error. [/color]
alert( intervalMsg ) ;
return null ;
}

var number = bufferB-bufferA ;

[COLOR=666666]// what kind of add to do? [/color]
switch (interval.charAt(0))
{
case 'd': case 'D':
iOut = parseInt(number / 86400000) ;
if(rounding) iOut += parseInt((number % 86400000)/43200001) ;
break ;
case 'h': case 'H':
iOut = parseInt(number / 3600000 ) ;
if(rounding) iOut += parseInt((number % 3600000)/1800001) ;
break ;
case 'm': case 'M':
iOut = parseInt(number / 60000 ) ;
if(rounding) iOut += parseInt((number % 60000)/30001) ;
break ;
case 's': case 'S':
iOut = parseInt(number / 1000 ) ;
if(rounding) iOut += parseInt((number % 1000)/501) ;
break ;
default:
[COLOR=666666]// If we get to here then the interval parameter[/color]
[COLOR=666666]// didn't meet the d,h,m,s criteria. Handle[/color]
[COLOR=666666]// the error. [/color]
alert(intervalMsg) ;
return null ;
}

return iOut ;
}


function myDates(date1,date2){
var vDateDiff = suycDateDiff( date1, date2, 'd' );

if( vDateDiff <= 0 )
alert(&quot;Please make sure Date 2 is a later date than Date 1&quot;);
else
alert(&quot;Looks good&quot;);

}


[COLOR=666666]//-->[/color]
</script>


[COLOR=000080][COLOR=FA5000]<form name=&quot;myform&quot;>[/color][/color]
Date 1: [COLOR=000080][COLOR=FA5000]<input type=&quot;Text&quot; name=&quot;date1&quot;>[/color][/color][COLOR=000080]<br>[/color]
Date 2: [COLOR=000080][COLOR=FA5000]<input type=&quot;Text&quot; name=&quot;date2&quot; onblur=&quot;myDates(this.form.date1.value,this.value)&quot;>[/color][/color][COLOR=000080]<br>[/color]
[COLOR=000080][COLOR=FA5000]<input type=&quot;Button&quot; value=&quot;Check Dates&quot; onclick=&quot;myDates(this.form.date1.value,this.form.date2.value)&quot;>[/color][/color]
[COLOR=000080][COLOR=FA5000]</form>[/color][/color] - tleish

 

[Gill1978]

a440guy ... i've already got javascript that checks the dates but in the dd/mmm/yyyy form how do i convert the dates so that after the check they can use the (date2 < date1).

tleish .... that works except for the month bit of the date entered, would this code only work for dates entered in dd/mm/yyyy format or will it also work for dates entered in dd/mmm/yyyy format?

the code used to check the date's are vaild is:

function CheckDate(THISDATE) {

if (THISDATE.value !== &quot;&quot
{
var err=0
a=THISDATE.value
if (a.length != 11) err=1
b = a.substring(3, 6)// month
c = a.substring(2, 3)// '/'
d = a.substring(0, 2)// day
e = a.substring(6, 7)// '/'
f = a.substring(7, 11)// year

if (b!=&quot;Jan&quot
if (b!=&quot;jan&quot
if (b!=&quot;Feb&quot
if (b!=&quot;feb&quot
if (b!=&quot;Mar&quot
if (b!=&quot;Mar&quot
if (b!=&quot;Apr&quot
if (b!=&quot;apr&quot
if (b!=&quot;May&quot
if (b!=&quot;may&quot
if (b!=&quot;Jun&quot
if (b!=&quot;jun&quot
if (b!=&quot;Jul&quot
if (b!=&quot;jul&quot
if (b!=&quot;Aug&quot
if (b!=&quot;aug&quot
if (b!=&quot;Sep&quot
if (b!=&quot;sep&quot
if (b!=&quot;Oct&quot
if (b!=&quot;oct&quot
if (b!=&quot;Nov&quot
if (b!=&quot;nov&quot
if (b!=&quot;Dec&quot
if (b!=&quot;dec&quot err = 1
if (d<1 || d>31) err = 1
if (f<1900) err = 1
if (e!=&quot;/&quot err=1
if (b==&quot;Apr&quot{
if (d==31) err=1
}
if (b==&quot;apr&quot{
if (d==31) err=1
}
if (b==&quot;Jun&quot{
if (d==31) err=1
}
if (b==&quot;jun&quot{
if (d==31) err=1
}
if (b==&quot;Sep&quot{
if (d==31) err=1
}
if (b==&quot;sep&quot{
if (d==31) err=1
}
if (b==&quot;Nov&quot{
if (d==31) err=1
}
if (b==&quot;nov&quot{
if (d==31) err=1
}

if (b==&quot;Feb&quot{
var g=parseInt(f/4)
if (isNaN(g)) {
err=1
}
if (d>29) err=1
if (d==29 && ((f/4)!=parseInt(f/4))) err=1
}
if (b==&quot;feb&quot{
var g=parseInt(f/4)
if (isNaN(g)) {
err=1
}
if (d>29) err=1
if (d==29 && ((f/4)!=parseInt(f/4))) err=1
}
if (err==1) {
alert(THISDATE.value + &quot; is not a valid date. Please re-enter in dd/mmm/yyyy format. \n e.g. 01/Jan/2001&quot;
THISDATE.value = &quot;&quot;
return false;

}
else if (THISDATE == &quot;&quot{
return
}
}
}