Javascript DOM HTML Input Date compare defaultValue and value

Introduction

An example that shows the difference between the defaultValue and value property:

Change the date of the date field, and then click the button.

The default value is not affected when you change the value of the date field.

View in separate window 

<!DOCTYPE html>
<html>
<body>
<input type="date" id="myDate" value="2020-02-10">
<button type="button" onclick="myFunction()">Test</button>

<p id="demo"></p>

<script>
function myFunction() {//from   ww w . ja  v  a2 s  .  c  o m
  var x = document.getElementById("myDate");
  var defaultVal = x.defaultValue;
  var currentVal = x.value;

  if (defaultVal == currentVal) {
    document.getElementById("demo").innerHTML = "Default value and current value is the same: "
    + x.defaultValue + " and " + x.value
    + "<br>Change the value of the date field to see the difference!";
  } else {
    document.getElementById("demo").innerHTML = "The default value was: " + defaultVal
    + "<br>The current value is: " + currentVal;
  }
}
</script>

</body>
</html>



PreviousNext

Related