JQuery TimePicker: как динамически изменять параметры

Question

Я использую JQuery Timepicker.

У меня есть два поля ввода - чтобы принять время.

<input id="startTime" size="30" type="text" /> 
<input id="endTime" size="30" type="text" /> 

Я использую таймер Jquery UI, как на documentation

$('#startTime').timepicker({ 
    'minTime': '6:00am', 
    'maxTime': '11:30pm', 
    'onSelect': function() { 
     //change the 'minTime parameter of #endTime <--- how do I do this ? 
    } 
}); 
$('#endTime').timepicker({ 
    'minTime': '2:00pm', 
    'maxTime': '11:30pm', 
    'showDuration': true 
}); 

Я хочу, что при выборе первой timePicker, параметр «minTime» для второй получает изменилось. В основном я пытаюсь собрать время начала и время окончания определенной активности. И я хочу, чтобы во втором поле ввода отображались параметры из значения первого поля ввода (время начала).

Answer 1

Вы бы сделать что-то вроде этого,

$('#startTime').timepicker({ 
       'minTime': '6:00am', 
       'maxTime': '11:30pm', 
        'onSelect': function() { 

        $('#endTime').timepicker('option', 'minTime', $(this).val());       
       } 
      }); 

Что вы здесь делаете, что в onSelect функции #startTime, вы установите параметр minTime от #endTime до значения #startTime

See это JS Fiddle.

Answer 2

jQuery-UI-виджеты обычно поддерживают метод options, который позволяет вам изменять параметры существующего экземпляра. Виджет методы вызываются поставляя строку в качестве первого аргумента плагина вызова:

$(...).widget_name('method_name', arg...) 

так это должно работать для вас:

$('#endTime').timepicker('option', 'minTime', new_min_time) 

Answer 3

Вы можете пойти на OnChange событие:

 $('#startTime').timepicker(); 

     $('#endTime').timepicker({ 
      'minTime': '12:00am', 
      'showDuration': true 
     }); 

     $('#startTime').on('changeTime', function() { 
      $('#endTime').timepicker('option', 'minTime', $(this).val()); 
     }); 

Я изменил код, размещенный в первом ответе, вот рабочая скрипка для него http://jsfiddle.net/NXVy2/215/

Вы можете использовать на («изменить» ... слишком

$('#startTime').on('change', function() { 
     $('#endTime').timepicker('option', 'minTime', $(this).val()); 
    });