TimePicker - Set the minTime greater than the selected start-time

Question

I have a star-time and end-time option which is working well.

start-time [8:00am, 8:30am, 9:00am, 9:30am, 10:00am]

end-time [8:00am, 8:30am, 9:00am, 9:30am, 10:00am]

If the user start-time selection is 9:00am, I have the following code working

$('#start-time').change(function(){
    $('#end-time').timepicker('option','minTime',$(this).val());
});

However, the above code shows options as

end-time [9:00am, 9:30am, 10:00am]

If the user start-time selection is 9:00am, then I would like the end-time options to only have greater tiles

end-time [9:30am, 10:00am]  (only)

How can I set the end-time greater than the selected start-time?

score 0 · Answer 1 · answered Sep 25 '18 at 17:29

Time-picker builds a LI list of options and adds a class ui-timepicker-selected.

I was able to grab the entire list then find the LI.ui-timepicker-selected class.

Once I grab the start-time value, I use jquery to go to the next item in the List and use the next value as my minTime.

Here is the code that is working:

$('#start-time').change(function(){

  var nexttime = $('li.ui-timepicker-selected').next('li').text();

  $('#end-time').timepicker('option','minTime',nexttime);

});

TimePicker - Set the minTime greater than the selected start-time

1 Answers1