How Can I Restrict The Dates In Date Input Into Php Using JQuery

In this article, we are going to learn how can I restrict the dates in date input into Php using Jquery

Step: 1
First, we need to create a date input into html or PHP file.

<input name="booking_date" value="<?php echo htmlspecialchars($edit ? $customer['booking_date'] : '', ENT_QUOTES, 'UTF-8'); ?>"  placeholder="Booking Date" class="form-control custom_class_for_time"  type="date" id="booking_date" required="required">

Step 2: add the following code into the script or js file, this allows only present or about date  

$(function(){
    var dtToday = new Date();
    var month = dtToday.getMonth() + 1;
    var day = dtToday.getDate();
    var year = dtToday.getFullYear();
    if(month < 10)
        month = '0' + month.toString();
    if(day < 10)
    day = '0' + day.toString();
    var minDate= year + '-' + month + '-' + day;
    $('#booking_date').attr('min', minDate);
    $('#booking_date').attr('beforeShowDay', 2);
 });
const picker = document.getElementById('booking_date');
picker.addEventListener('input', function(e){
  var day = new Date(this.value).getUTCDay();
  if([6,0].includes(day)){
    e.preventDefault();
    this.value = '';
    $(".booking_date_error").html('Booking not allow on Weekends staff holiday.');
  }else{
     $(".booking_date_error").html('');
  }
});

Step 3: Review the result

Submit a Comment

Your email address will not be published. Required fields are marked *

Subscribe

Select Categories