I am trying to put a minimum date in my contact form 7, in the calendar it works normally, but if the user goes with the keyboard he can put an earlier date. How can I make it so that the user can't go beyond the minimum date on the keyboard?
<label for="date">Dates <sup> ∗</sup> : </label>
[date* date id:dates class:form-control date-format:dd/mm/yy first-day:1 placeholder ""]
<script>
var today = new Date();
today.setDate(today.getDate() - 0);
today = today.toISOString().split('T')[0];
document.getElementsByName("date")[0].setAttribute('min', today);
</script>
CodePudding user response:
This javascript could make the magic.
document.getElementsByName("date")[0].addEventListener("change", function(e){
var min = this.getAttribute('min');
if(this.value < min){
this.value = min;
/*
you can also set a message to warn the user that the value has
changed because it has a min date.
*/
}
});