Geek asks and answers

JQuery TimePicker: how to dynamically change parameters

I am using jQuery Timepicker.

I have two input fields - for taking time.

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

I am using Jquery UI timer as per 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
});

I want when the first timer is selected, the "minTime" parameter for the second is changed. Basically I try to collect the start time and end time of a certain activity. And I want the second input field to display the parameters from the value of the first input field (the very beginning).

+5
source share
3 answers

You would do something like this,

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

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

What do you do, so it is here that the onSelectfunction #startTimeyou change the setting minTimeof #endTimethe value of#startTime

JS Fiddle.

+6

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/

on ('change'... too

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

jQuery-UI widgets usually support a method optionsthat allows you to modify the parameters of an existing instance. Widget methods are called by supplying a string as the first argument to call the plugin:

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

so this should work for you:

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

More articles:


All Articles