I am having an input date field in my php/html page. In my date field i need to throw an error if the input date is greater than today (sysdate). Is it possible? if so please help. Here is my html script of input field. Another JavaScript is also working based on the input date to the field to identify the due date automatically.

<div class="form-group">
<div class="input-group col-sm-4">
<div class="input-group-addon">Transaction Date&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-calendar"></i></div>
<input id ="txndt" class="form-control" type="date" name ="purch_date" onblur = "txn40();" required />
</div>
</div>

I am having an input date field in my php/html page. In my date field i need to throw an error if the input date is greater than today (sysdate). Is it possible? if so please help. Here is my html script of input field. Another JavaScript is also working based on the input date to the field to identify the due date automatically.

<div class="form-group">
<div class="input-group col-sm-4">
<div class="input-group-addon">Transaction Date&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-calendar"></i></div>
<input id ="txndt" class="form-control" type="date" name ="purch_date" onblur = "txn40();" required />
</div>
</div>

• javascript
• html
• date

• Are you using some calendaring library? – jfriend00 Commented Nov 2, 2014 at 16:21
• You should post your javascript. Also date is not a valid input type – DarkBee Commented Nov 2, 2014 at 16:21
• 3 @DarkBee Get with HTML5. – Scimonster Commented Nov 2, 2014 at 16:22

3 Answers 3

It worked with java script also. I have called a java script from my 'form'. Here is the solution.It is working as expected by me.

Form

<form  name="purchase" id ="purchase" method="post" action="" onsubmit="return checkform()">
    <div class="form-group">
        <div class="input-group col-sm-4">
            <div class="input-group-addon">Transaction Date&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-calendar"></i></div>
                <input id ="txndt" class="form-control" type="date" max="<?php echo date("Y-m-d")?>" name ="purch_date" value="<?php echo $query2['purch_date'] ?>" onblur = "txn40();" required />
        </div>
    </div>
</form>

Java Script

<script type="text/javascript">
    function checkform()
    {
    var dateString = document.purchase.txndt.value;
    var myDate = new Date(dateString);
    var today = new Date();
         if (document.purchase.txndt.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>

Thanks to all for support.

You can pare the valueAsDate property against the current date.

document.querySelector('#txndt').onchange = function() {
    if (this.valueAsDate > new Date) {
        alert("You can't pick a future date!")
    }
};

Worked with 'max' function and 'php'. Working fine in chorome browser (HTML 5 supported browser). Changed the input with the below one.

<input id ="txndt" class="form-control" type="date" max="<?php echo date("Y-m-d")?>" name ="purch_date" onblur = "txn40();" required />