disable few dates from calendar javascript code example

Example: disable few dates from calendar javascript

<head>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>

<body>
<input required class="datepicker" id="datepicker1" type="text" name="date" placeholder="Collection Date" autocomplete="off">  
</body>
  
<script>
// datepicker validation
$(document).ready(function() {

    var dates1 = ["20/05/2021", "21/05/2021", "22/05/2021"];

    function DisableDates1(date1) {
        var string = jQuery.datepicker.formatDate('dd/mm/yy', date1);
        return [dates1.indexOf(string) == -1];
    }

    jQuery("#datepicker1").datepicker({
        minDate: 2,
        dateFormat: "yy-mm-dd",
        changeMonth: true,
        numberOfMonths: 1,
        changeYear: true,

        beforeShowDay: DisableDates1,

        onClose: function(selectedDate, inst) {
            var minDate = new Date(Date.parse(selectedDate));
            minDate.setDate(minDate.getDate() + 2);
            jQuery("#datepicker2").datepicker("option", "minDate", minDate);
        }
    });
});
</script>

Tags:

Javascript Example

Recent Posts