JSFiddle - React, Tailwind, and code Playground
HTML
<label for="from">From</label>
<input type="date" size="8" name="advDurFrom" style="text-align:center; cursor:pointer;" />
<label for="to">to</label>
<input type="date" size="8" name="advDurTo" style="text-align:center; cursor:pointer;" />
JavaScript
var isOK = false;
var isOK2 = false;
$('input[name=advDurFrom]').blur(function () {
var x = $('input[name=advDurFrom]').val();
try {
date1 = new Date(x);
isOK = !isNaN(date1);
} catch (e) {
isOK = false;
}
printDiff();
});
$('input[name=advDurTo]').blur(function () {
var y = $('input[name=advDurTo]').val();
try {
date2 = new Date(y);
isOK2 = !isNaN(date2);
} catch (e) {
isOK2 = false;
}
printDiff();
});
function printDiff() {
if (isOK && isOK2) {
var one_day = 1000 * 60 * 60 * 24;
var diff = Math.ceil((date2.getTime() - date1.getTime()) / (one_day));
console.log(new Date(1528281040192), new Date(1527782400000));
console.log(new Date(1524153600000));
console.log(diff + ' days');
}
}