JavaScript function to check date field for future date

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • jmartmem
    New Member
    • Feb 2008
    • 87
    #1

    JavaScript function to check date field for future date

    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
    Tags: checkdate() past
    • acoder
      Recognized Expert MVP
      • Nov 2006
      • 16032
      #2
      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.

        Comment

        • jmartmem
          New Member
          • Feb 2008
          • 87
          #3
          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:

          Code:
          <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type="text/javascript">
function checkform()
{
	 if (document.form1.entrydate01.value == "")
	 { 
	  //something is wrong
	  alert('REQUIRED FIELD ERROR: Please enter date in field!')
	  return false;
	  }
	  // if script gets this far through all of your fields
	  // without problems, it's ok and you can submit the form
	  return true;
	 }
</script>

<script type="text/javascript">
function checkdate()
{
var myDate = new Date(document.form1.entrydate01.value);
var today = new Date();
{
	if (myDate>today)
	{
	alert('You cannot enter a date in the future!')
	return false;
	 }
	else alert('This is a valid date')
	return true;
}
}
</script>
</head>
<body>

<form action="" method="post" name="form1" id="form1" onsubmit="return checkform();return checkdate()">
  <label>
  <input type="text" name="entrydate01" id="entrydate01" value="<%= FormatDateTime(Date, 0)%>"/>
  </label>
  <label>
  <input type="submit" name="Submit" id="Submit" value="Submit" />
  </label>
</form>

</body>
</html>
          Any suggestions?

            Comment

            • acoder
              Recognized Expert MVP
              • Nov 2006
              • 16032
              #4
              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.

                Comment

                • jmartmem
                  New Member
                  • Feb 2008
                  • 87
                  #5
                  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:

                  Code:
                  <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type="text/javascript">
var dateString = document.form1.entrydate01.value;
var myDate = new Date(dateString);
var today = new Date();

function checkform()
{
	 if (document.form1.entrydate01.value == "")
	 { 
	  //something is wrong
	  alert('REQUIRED FIELD ERROR: Please enter date in field!')
	  return false;
	  }
	  else if (myDate>today)
	  { 
	  //something else is wrong
		alert('You cannot enter a date in the future!')
		return false;
	  }
	  // if script gets this far through all of your fields
	  // without problems, it's ok and you can submit the form
	  return true;
	 }
</script>
</head>
<body>

<form action="" method="post" name="form1" id="form1" onsubmit="return checkform()">
  <label>
  <input type="text" name="entrydate01" id="entrydate01" value="<%= FormatDateTime(Date, 0)%>"/>
  </label>
  <label>
  <input type="submit" name="Submit" id="Submit" value="Submit" />
  </label>
</form>

</body>
</html>

                    Comment

                    • acoder
                      Recognized Expert MVP
                      • Nov 2006
                      • 16032
                      #6
                      Lines 9-11 should be inside the checkform() function.

                        Comment

                        • jmartmem
                          New Member
                          • Feb 2008
                          • 87
                          #7
                          That did it! It's usually something simple that I overlook.

                          Thanks, acoder!

                          JM

                            Comment

                            • acoder
                              Recognized Expert MVP
                              • Nov 2006
                              • 16032
                              #8
                              You're welcome. Glad it's working :)

                                Comment

                                Previous template Next
                                Working...