Friday, November 29, 2019

Calendor specific days hide using jquery

<!--script for calendor date hide -->
    <link href="http://www.jquerycookbook.com/demos/css/jquery-ui.css" rel="stylesheet" />
    <script src="http://www.jquerycookbook.com/demos/scripts/jquery-1.11.1.min.js"></script>
    <script src="http://www.jquerycookbook.com/demos/scripts/jquery-ui.min.js"></script>
    <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  
<script type="text/javascript">
   $(function () {
        var unavailableDay = 2; // disable tuesdays
         var unavailableDay1 = 3; 
         
        function disableDays(date) {        
            var day = date.getDay(); 
            return [(day != unavailableDay && day != unavailableDay1), ""];
           
        }

        $('#datepicker').datepicker({ 
            beforeShowDay: disableDays,
             minDate: '+1',   // date start tomorrow
             maxDate:'+2m'  // next 2month date show
        });

        $("#changeDates").on('click', function () {
            unavailableDay = 3; // disable wednesdays 
            $("#datepicker").datepicker("refresh");
        });
    });
</script>
<!--script for calendor date hide--->

  <input type="text" id="datepicker" />

1 comment: