<input type="date" name="bday" id="biday" required>

I have to take the date from input type date field from the user and if the entered date is greater than the current date i have to print some error in the alert box. I Have tried various methods but none of them worked for input type date. I tried to take two variables one which stores the current date and the second which takes the value of date input element `

var startDate = Date(document.getElementByID('biday').value);
    var today = new Date();
    if (startDate > today) {
        alert("The first date is after the second date!");

`.Can someone please help me the procedure to get the task done.

<input type="date" name="bday" id="biday" required>

I have to take the date from input type date field from the user and if the entered date is greater than the current date i have to print some error in the alert box. I Have tried various methods but none of them worked for input type date. I tried to take two variables one which stores the current date and the second which takes the value of date input element `

var startDate = Date(document.getElementByID('biday').value);
    var today = new Date();
    if (startDate > today) {
        alert("The first date is after the second date!");

`.Can someone please help me the procedure to get the task done.

• javascript
• date

• 1 Show us some of your approaches, otherwise we will not be able to help you – Andrzej Smyk Commented Oct 3, 2017 at 10:40
• startDate.getTime() > new Date().getTime() – Daniel Commented Oct 3, 2017 at 10:44
• @AndrzejSmyk added my approach. – Anidh Singh Commented Oct 3, 2017 at 10:45
• @Daniel Thanks for suggestion but i tried and that's not working any other approach? – Anidh Singh Commented Oct 3, 2017 at 10:48

4 Answers 4

Here is the another way.

HTML

 <input type="date" id="dval" value="" />
 <button onclick="test()">TEsting</button>

JS

 function test() {
     var q = new Date();
     var date = new Date(q.getFullYear(),q.getMonth(),q.getDate());
     var mydate = new Date(document.getElementById('dval').value);

     if(date > mydate) {
        alert("Current Date is Greater THan the User Date");
     } else {
        alert("Current Date is Less than the User Date");
     }
  }

DEMO

Note: type="date" is not supported in Firefox, or Internet Explorer 11 and earlier versions.

You've got a little typo at getElementByID it should be getElementById

Also it is possible to pare date strings as the MYSQL Format 'YYYY-MM-DD' so you could actually pare two values directly as a string.

 '2017-12-1' < '2017-12-3'
 // true

If you are operating with another format you can either create a new Date Object and parse it to a TimeStamp like following:

// Receives a date String or Object
// and returns the aprox TimeStamp
function valueifyDate(date){
    if(typeof date == 'object'){
    return date.getTime();
  }else{
    return new Date(date).getTime();
  } 
}

var bday = document.getElementById('birthday');
bday.addEventListener("change", function(e){
  var today = new Date();
  if(valueifyDate(today) < valueifyDate(e.target.value)){
    console.log("younger than today");
  }
})

https://jsfiddle/jbnLx3v3/

To check whether you have date in startDate it is better to use Date.parse (which is implicitly used in Date constructor) and pare check if it is not NaN. As already mentioned, you need to get numeric value corresponding to the time by using today.getTime(). Then you can pare parsed startDate and today.getTime(). Also it should be getElementById not getElementByID. Please see corrected code below:

function pareDates() {
  var startDate = Date.parse(document.getElementById('biday').value);
  var today = new Date();
  if (!isNaN(startDate) && startDate > today.getTime()) {
    alert("The first date is after the second date!");
  }
}

<input type="date" name="bday" id="biday" required onchange='pareDates()'>

There are number of errors on your code like getElementByID should be getElementById and you are not taking the value from input and so on. Check below snippet for reference.

function checkDate() {

  var startDate = new Date(document.getElementById('biday').value);
  var today = new Date();
  if (startDate.getTime() > today.getTime()) {
    alert("The first date is after the second date!");
  }  
}

<input type="date" name="bday" id="biday" required>
<input type="submit" value="check" onclick="checkDate()">