Search code examples
javascriptjquerylaraveltimepicker

Laravel-9 jQuery Timepicker Disable specific time how?


$(document).ready(function(){
    $('#time').timepicker({
    timeFormat: 'h:mm a',
    interval: 60,
    minTime: '9',
    maxTime: '4:00pm',
    defaultTime: '9',
    startTime: '9:00',
    dynamic: false,
    dropdown: true,
    scrollbar: true,
    });
});

How can I disable/remove 12pm from the selection of this jQuery timepicker? timepicker.co

9:00am 10:00am 11:00am 1:00pm 2:00pm 3:00pm 4:00pm


Solution

  •             $(function() {
        $('#disableTimeRangesExample').timepicker({ 
            step: 60,
            minTime:'9:00 a' ,
            maxTime: '4:00 p',
            defaultTime: '9',
            startTime: '9:00 a',
            dynamic: false,
            dropdown: true,
            scrollbar: true,
            'disableTimeRanges': [['12:00pm','12:01pm'],] 
              });
        });
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <link href="https://www.jonthornton.com/jquery-timepicker/documentation-assets/bootstrap-datepicker.css" rel="stylesheet"/>
    <script src="https://www.jonthornton.com/jquery-timepicker/documentation-assets/bootstrap-datepicker.js"></script>
    
    <link href="https://www.jonthornton.com/jquery-timepicker/jquery.timepicker.css" rel="stylesheet"/>
    <script src="https://www.jonthornton.com/jquery-timepicker/jquery.timepicker.js"></script>
    
    
    <div class="demo">
    <input id="disableTimeRangesExample" type="text" class="time ui-timepicker-input" autocomplete="off">
       </div>

    You can try with disableTimeRanges option to disable the range of 12pm to 12:01pm in jQuery Timepicker

    $(function() {
    $('#disableTimeRangesExample').timepicker({ 
    step: 60,
    minTime:'9:00 a' ,
    maxTime: '4:00 p',
    defaultTime: '9',
    startTime: '9:00 a',
    dynamic: false,
    dropdown: true,
    scrollbar: true,
    disableTimeRanges': [['12:00pm','12:01pm']] 
          });
    });