Search code examples
jquerytwitter-bootstraptimepickerbootstrap-datetimepicker

How to restrict the bootstrap timepicker min-time and max-time?


I am using bootstrap time picker by using bootstrap-timepicker.js and i want to restrict the min-time and max-time of that timepicker .Can anyone please tell me how can i achieve it. I have used following methods but nothing gonna help me out:

 $('input[data-role="time"]').timepicker({
    showMeridian: true,
    minTime: {
    hour: 10,
    minute: 15
    },
    minuteStep: 1,
    showInputs: true,
    defaultTime: defaulttime
    }) 

And

$('input[data-role="time"]').timepicker({
        showMeridian: true,
        minTime: '10:15',
        minuteStep: 1,
        showInputs: true,
        defaultTime: defaulttime
        })

Solution

    1. use event changeTime,
    2. check the current time,
    3. if time is less set minimum

    http://jsfiddle.net/j3kf2p2e/

    $('#timepicker').timepicker({
            showMeridian: true,        
            minuteStep: 1,
            showInputs: true,        
    }).on('changeTime.timepicker', function(e) {    
        var h= e.time.hours;
        var m= e.time.minutes;
        var mer= e.time.meridian;
        //convert hours into minutes
        m+=h*60;
        //10:15 = 10h*60m + 15m = 615 min
        if(mer=='AM' && m<615)
            $('#timepicker').timepicker('setTime', '10:15 AM');
      });