Link to home
Start Free TrialLog in
Avatar of j_machale
j_machale

asked on

JavaScript + dates

I have two text boxes as part of a web page - a start date and a finish date. I would like to validate the dates and check to see if the start date is before the finish or not.TIA
ASKER CERTIFIED SOLUTION
Avatar of mayhew
mayhew

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of j_machale
j_machale

ASKER

Thanks mayhew. Is there a coressponding funtion to isNaN() for time ?
Hi j_machale,

I'm glad that worked for you.


I don't understand your follow-up, though.

There isn't really a time object.  Times are stored with the date in a date object.

Can you describe what it is you're trying to do?
Sorry, I think I misunderstood what the NaN()does(Started writing JS today!). I wanted to see if one time came after another time as my page now has start date & time and finish date & time. I want to keep the error message separate for the date/time fields. This is my attempt at the code for it.

function CheckTimes(){

  time1 = new String("1/1/99 ");
  time2 = new String("1/1/99 ");

  time1 = time1.concat(new String (d1.value));
  time2 = time2.concat(new String (d2.value));
 
  date1 = eval("new Date(time1)");
  date2 = eval("new Date(time2)");
 
  if (isNaN(date1)){
    alert ('Time1 is invalid.');
  }
  else if (isNaN(date2)){
    alert ('Time2 is invalid.');
  }
  else if (date1>date2){
    alert ('Time1 is after Time2');
  }
  else{
     alert ('Working OK');
  }
}

Is there a better way ?. Thanks,j.
Are your times in their own text boxes?  (i.e. separate from the date boxes)


Are d1 and d2 your time text boxes?



If that's the case, I don't understand why you would want to check for the times separately.

10 PM on the 1st is earlier than 5 PM on the 5th.  Isn't that what you want to test for?

Can you give me a better idea what you're trying to do?
Yes I should probably put them together but I was setting the focus back to the text box where the err occured. I just want to make it as UF as possible. On the page there are now four TB's called D1,D2,T1,T2. D1,T1 is the start date & time for the meeting and D2,T2 is the end date & time for the meeting. Any suggestion on how to do this neatly would be greatly appricated. My sincere thanks,j.
Sure, I can help you with the code.

No problem.  :)


The question I still have, though, is if you really want to verfity if time1 is later than time2.

I think that you basically need to test for five things (if you have four different text boxes).

1) Date1 is valid.
2) Date2 is valid.
3) Time1 is valid.
4) Time2 is valid.
5) Date1+Time1 < Date2+Time2


Does this sound right?  Or am I missing something?

Let me know and I'll work up a sample.  

I think you're already pretty close.
Yes that is the idea
Again, this is very basic.  But this will get you started.

A couple of notes.  This doesn't test for the times being empty (I didn't know if you would want that).  You can put an if in to check if your textboxes are empty when you're assigning values to variables.

Also, once you get values into the date objects, you can then do all of the javascript date and time functions to get parts of the date/time.

For example, you can look at the month, day, hour, or whatever of a date object and decide if you like it or not.

A decent reference is at
http://developer.netscape.com/docs/manuals/communicator/jsref/contents.htm


Also, I didn't really need the eval's in the first code segment that I gave you.  I wasn't sure and so I threw them in.  But you don't really need them in this case.

Let me know if you have questions with any of this.

Your own code was *very* close.  Pretty good for a new js programmer.  ;)


<form name="myform" action="http://www.whatever.com">
  Date1 <input type="textbox" name="date1"><br>
  Time1 <input type="textbox" name="time1"><br><br><br>

  Date2 <input type="textbox" name="date2"><br>
  Time2 <input type="textbox" name="time2"><br><br>
 
  <input type="button" name="go" value="Go" onclick="CheckDates();">
</form>


<script language=javascript>
function CheckDates(){
  var date1
  var date2

  var time1
  var time2

  var datetime1
  var datetime2

  date1 = new Date(document.forms[0].date1.value);
  date2 = new Date(document.forms[0].date2.value);

  time1 = new Date("1/1/89 "+document.forms[0].time1.value);
  time2 = new Date("1/1/89 "+document.forms[0].time2.value);

  datetime1 = new Date(document.forms[0].date1.value +" "+ document.forms[0].time1.value);
  datetime2 = new Date(document.forms[0].date2.value +" "+ document.forms[0].time2.value);


  if (isNaN(date1)){
    alert ('Date1 is invalid.');
  }
  else if (isNaN(date2)){
    alert ('Date2 is invalid.');
  }
  else if (isNaN(time1)){
    alert ('Time1 is invalid.');
  }
  else if (isNaN(time2)){
    alert ('Time2 is invalid.');
  }
  else if (datetime1>datetime2){
    alert ('Date1 is after Date2');
  }
  else{
    document.write(date1+"|"+date2+"<br>");
    document.write(time1+"|"+time2+"<br>");
    document.write(datetime1+"|"+datetime2+"<br>");
    //myform.submit();
  }
}

</script>
Thanks for the help but I may have to try another approcah. This will let the user put in a date like 123/12/99 and more importantly thinks that 1/1/00 is earlier than 1/1/99. Is there any way to parse a string in JS ? Will send more points if necessary. j.
Yes, you can parse through the parts of a javascript date object.

That's what I was trying to say in my last post.

If you go to the link I mentioned and scroll down to Date (about one third of the way down) there is a link to the date object and its methods and properties.

Here is the direct link to the date methods.

http://developer.netscape.com/docs/manuals/communicator/jsref/core3.htm#1012948


There you will see methods like MyDate.getHours and things like that.

You can get and set each of the different parts of your date object by using those methods.

For example, you could getDay and check that the value is between 1 and 31.  If not, set it to 1 (for example) or trigger an error.

You can go through and write code to check each part of the date and write very specific error handling that way.

Let me know if that's what you're looking for.