By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,966 Members | 812 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,966 IT Pros & Developers. It's quick & easy.

JavaScript function to check date field for future date

P: 87
Greetings,

I have an ASP page with a form (form1) that contains a JavaScript validation function that is activated onSubmit. The function contains a series of IF statements to alert the user to any blanks contained in the form elements.

What I want to do is add a new IF statement to the function that checks whether the user has populated a date field (entry_date01) with a date that is in the future. In other words, the user can input the current date (or even a past date) but not a future date.

I know some JavaScript but not enough to code the above function. I would appreciate anyone's help in accomplishing this task.

Regards,

JM
Sep 17 '08 #1
Share this Question
Share on Google+
7 Replies


acoder
Expert Mod 15k+
P: 16,027
Take the date input and convert it into a Date object. Create another new Date object (which defaults to the current date/time) and compare the two. See example.
Sep 17 '08 #2

P: 87
I understand the concept, but I'm not sure how to write the code to convert the date input into a Date object.

To practice, I created a simple ASP page with a form that contains one text field and a submit button. For simplicity's sake, the text field value is initially populated with today's date.

I wrote two JavaScript functions to be activated onSubmit: (1) a check for a null value in the text field, and (2) the date conversion and comparison. The first function works fine, but there's something with the 2nd function I'm missing and it's probably the conversion code.

Here's what I have so far:

Expand|Select|Wrap|Line Numbers
  1. <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>Untitled Document</title>
  7.  
  8. <script type="text/javascript">
  9. function checkform()
  10. {
  11.      if (document.form1.entrydate01.value == "")
  12.      { 
  13.       //something is wrong
  14.       alert('REQUIRED FIELD ERROR: Please enter date in field!')
  15.       return false;
  16.       }
  17.       // if script gets this far through all of your fields
  18.       // without problems, it's ok and you can submit the form
  19.       return true;
  20.      }
  21. </script>
  22.  
  23. <script type="text/javascript">
  24. function checkdate()
  25. {
  26. var myDate = new Date(document.form1.entrydate01.value);
  27. var today = new Date();
  28. {
  29.     if (myDate>today)
  30.     {
  31.     alert('You cannot enter a date in the future!')
  32.     return false;
  33.      }
  34.     else alert('This is a valid date')
  35.     return true;
  36. }
  37. }
  38. </script>
  39. </head>
  40. <body>
  41.  
  42. <form action="" method="post" name="form1" id="form1" onsubmit="return checkform();return checkdate()">
  43.   <label>
  44.   <input type="text" name="entrydate01" id="entrydate01" value="<%= FormatDateTime(Date, 0)%>"/>
  45.   </label>
  46.   <label>
  47.   <input type="submit" name="Submit" id="Submit" value="Submit" />
  48.   </label>
  49. </form>
  50.  
  51. </body>
  52. </html>
Any suggestions?
Sep 18 '08 #3

acoder
Expert Mod 15k+
P: 16,027
The reason it doesn't work is that you're returning with "return checkform()", so checkdate() never gets called. The easiest solution is to call checkdate within checkform.
Sep 18 '08 #4

P: 87
Okay. I corrected that but it's still not working right. Now when I click the submit button I get an IE error on the page for line 9 that says, "document.form1.entrydate01 is null or not an object". I get this error even when there's a date in the text box

Here's the updated code:

Expand|Select|Wrap|Line Numbers
  1. <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>Untitled Document</title>
  7.  
  8. <script type="text/javascript">
  9. var dateString = document.form1.entrydate01.value;
  10. var myDate = new Date(dateString);
  11. var today = new Date();
  12.  
  13. function checkform()
  14. {
  15.      if (document.form1.entrydate01.value == "")
  16.      { 
  17.       //something is wrong
  18.       alert('REQUIRED FIELD ERROR: Please enter date in field!')
  19.       return false;
  20.       }
  21.       else if (myDate>today)
  22.       { 
  23.       //something else is wrong
  24.         alert('You cannot enter a date in the future!')
  25.         return false;
  26.       }
  27.       // if script gets this far through all of your fields
  28.       // without problems, it's ok and you can submit the form
  29.       return true;
  30.      }
  31. </script>
  32. </head>
  33. <body>
  34.  
  35. <form action="" method="post" name="form1" id="form1" onsubmit="return checkform()">
  36.   <label>
  37.   <input type="text" name="entrydate01" id="entrydate01" value="<%= FormatDateTime(Date, 0)%>"/>
  38.   </label>
  39.   <label>
  40.   <input type="submit" name="Submit" id="Submit" value="Submit" />
  41.   </label>
  42. </form>
  43.  
  44. </body>
  45. </html>
Sep 19 '08 #5

acoder
Expert Mod 15k+
P: 16,027
Lines 9-11 should be inside the checkform() function.
Sep 19 '08 #6

P: 87
That did it! It's usually something simple that I overlook.

Thanks, acoder!

JM
Sep 19 '08 #7

acoder
Expert Mod 15k+
P: 16,027
You're welcome. Glad it's working :)
Sep 19 '08 #8

Post your reply

Sign in to post your reply or Sign up for a free account.