JSFiddle - React, Tailwind, and code Playground

by Joe

HTML

<p>
    <label>Date:</label>
    <br />
    <input type="text" name="date" id="date" placeholder="DD/MM/YYYY" onkeyup="checkDate()" />
</p>
<div id="datewarn"></div>

JavaScript

function isFutureDate(idate){
    var today = new Date().getTime(),
        idate = idate.split("/");
    
    idate = new Date(idate[2], idate[1] - 1, idate[0]).getTime();
    return (today - idate) < 0 ? true : false;
}

// Demo example
console.log(isFutureDate("2/3/2014")); // true
console.log(isFutureDate("1/1/2014")); // false

// your function
function checkDate(){
    var idate = document.getElementById("date"),
        resultDiv = document.getElementById("datewarn"),
        dateReg = /(0[1-9]|[12][0-9]|3[01])[\/](0[1-9]|1[012])[\/]201[4-9]|20[2-9][0-9]/;
    
    if(dateReg.test(idate.value)){
        if(isFutureDate(idate.value)){
            resultDiv.innerHTML = "Entered date is a future date";
            resultDiv.style.color = "red";
        } else {
            resultDiv.innerHTML = "It's a valid date";
            resultDiv.style.color = "green";
        }
    } else {
        resultDiv.innerHTML = "Invalid date!";
        resultDiv.style.color = "red";
    }
}