2012-06-09 18 views
5

Sto usando un Jepery Timepicker.Jquery TimePicker: Come modificare dinamicamente i parametri

Ho due campi di input: per accettare orari.

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

Sto usando un timer jQuery UI come da 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 
}); 

voglio che, quando è selezionata la prima TimePicker, il parametro 'MINTIME' per il secondo viene cambiato. Fondamentalmente sto cercando di raccogliere l'ora di inizio e l'ora di fine per determinate attività. E voglio che la seconda casella di input mostri le opzioni dal valore del primo campo di input (ora di inizio) stesso.

+0

penso che la stessa domanda potrebbe essere valida per altri elementi JQuery pure. –

+0

Quella pagina ha un esempio (ultimo) in cui viene eseguita insieme alla [fonte] (http://jonthornton.github.com/jquery-timepicker/lib/datepair.js). – sachleen

risposta

6

Si potrebbe fare qualcosa di simile,

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

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

Quello che state facendo qui è che nella funzione onSelect del #startTime, si imposta l'opzione minTime del #endTime al valore di #startTime

See questo JS Fiddle.

+0

Fantastico! Grazie compagno . Questo ha funzionato. Saluti ! –

+3

non funziona per me così come il tuo JS Fiddle –

+1

Questo JS Fiddle non mostra cambiamenti di minTime. È sempre 02:00 – ivanacorovic

4

I widget jQuery-UI supportano generalmente un metodo options che consente di modificare le opzioni su un'istanza esistente. metodi di widget sono chiamati fornendo una stringa come primo argomento per la chiamata plugin:

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

quindi questo dovrebbe funzionare per voi:

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

Grazie signore! Questo è stato utile :) –

+0

L'opzione funziona perfettamente, dovrebbe essere contrassegnata come risposta corretta! – ivanacorovic

6

si può andare per onchange evento:

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

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

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

Ho modificato il codice un po 'postato in prima risposta qui è il violino funzionante per esso http://jsfiddle.net/NXVy2/215/

.210

si può usare su ('cambiamento' ... troppo

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

La risposta accettata non funziona (più?), Ma questo ha funzionato perfettamente per me. – nematoth

+0

Questa è la risposta corretta! Grazie per questo – marknt15

Problemi correlati