Check if date is in the past without submitting form

Question

I have this code that I want to check if a date is in the past. I want to check it as soon as the date is entered, before form submission.

Answer 1

All you need to do is convert the string produced by the <input> into a Date using the Date constructor new Date("2014-06-12")

 function checkDate() {
   var selectedText = document.getElementById('datepicker').value;
   var selectedDate = new Date(selectedText);
   var now = new Date();
   if (selectedDate < now) {
    alert("Date must be in the future");
   }
 }

<input id="datepicker" onchange="checkDate()" required class="datepicker-input" type="date" data-date-format="yyyy-mm-dd" >

Answer 2

The date() function returns a string. Try converting both dates to integers first using the Date.parse() function:

<input id="datepicker" onchange="checkDate()" required class="datepicker-input" type="text" data-date-format="yyyy-mm-dd" >

<script type="text/javascript">
   function checkDate() {
       var selectedDate = document.getElementById('datepicker').value;
       var now = new Date();
       var dt1 = Date.parse(now),
       dt2 = Date.parse(selectedDate);
       if (dt2 < dt1) {
            alert("Date must be in the future");
       }
 }
</script>

Answer 3

You can use

_isDate1LowerThanDate2(date1, date2) {
    return new Date(date1) < new Date(date2);
  }

Answer 4

Simple mine function working ...

function check_not_past_date_time(enter_date) {
    var a =new Date(enter_date);
    var now =new Date();
    if(a>now){
        return true;
    }else {
        return false;
    }
}

Answer 5

For those who use type="date" (introduced with HTML5) instead of type="text", it can be done this way:

 function checkDate() {
   var date = this.value;
   if(date.valueAsDate <= new Date()) {
       //Date in the past
   } else {
       //Date in the future
   }
}

Answer 6

Your code is really close, try this instead:

var selectedDate = $('#datepicker').datepicker('getDate');
var now = new Date();
if (selectedDate < now) {
  // selected date is in the past
}