In this tutorial we will learn how to set contact form 7’s date field restriction to today+7 days plus restrict to pick backward dates and set current value to Today’s date.
As we know contact form Date Field syntax is like given below
<label>Preferred date*
[date* preffered_date]
</label>
Now set minimum date
[date* preffered_date min:today ]
Now set date salection to upcoming 7days
[date* preffered_date min:today max:today+7days ]
Now going to add id and set the value using javascript
[date* preffered_date min:today max:today+7days id:datePicker]
<label>Name*
[text* full_name] </label>
<label>Grade*
[text* grade] </label>
<label>Subject*
[text* subject] </label>
<label>Preferred date*
[date* preffered_date min:today max:today+7days id:datePicker]
</label>
<label>Timezone/Location*
[text* timezone_location] </label>
<label>Email*
[email* your-email autocomplete:email] </label>
<label>Phone (WhatsApp/Telegram)
[number phone]</label>
<label>Message*
[textarea* message minlength:10 maxlength:600 ] </label>
<label>Attach file (Max. Size 10MB, allowed doc,docx,pdf,xlsx)
[file attachments limit:10mb filetypes:doc|docx|pdf|xlsx|PDF]
</label>
[submit "Submit"]
<script>
jQuery(function ($) {
var now = new Date();
var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);
var today = now.getFullYear()+"-"+(month)+"-"+(day);
$('#datePicker').val(today);
$("#datePicker").attr("min", today);
});
</script>