2013-10-11 16 views
5

Ho inserito due datepikcer dalla data e alla data nella mia pagina Web per generare un rapporto. Voglio applicare la convalida su entrambi datepicker per la selezione della data. Ho scritto codice jquery comune per impostare la data minima e massima di entrambi datepikcer ma non ha funzionato per me. Ho anche scritto il codice per impostare la data minima e massima alla chiusura di datepicker.Come impostare la data minima e massima dinamicamente nel selettore di date dell'interfaccia utente jquery

Il mio requisito è che voglio impostare la data minima e massima dinamicamente quando datepicker è inizializzato. Poi, dopo impostare anche un altro massimo e data minima quando l'utente può selezionare la data da qualsiasi datepicker

$("#frm_date").datepicker({ 
showOn: 'button', 
buttonImage: 'images/calendar.gif', 
buttonImageOnly: true, 
dateFormat:'yy-mm-dd', 
onClose: function(selectedDate) { 
          $("#to_date").datepicker("option", "minDate", selectedDate); 
       } 
}); 


$("#to_date").datepicker({ 
showOn: 'button', 
buttonImage: 'images/calendar.gif', 
buttonImageOnly: true, 
dateFormat:'yy-mm-dd', 
onClose: function(selectedDate) { 
         $("#frm_date").datepicker("option", "maxDate", selectedDate); 
        } 
}); 

$(".datepick").datepicker({dateFormat:'yy-mm-dd',minDate:'2013-09-10' ,maxDate:'2013-10-10'}); 

risposta

3

ho risolto il mio problema utilizzando il codice sottostante.
Vedere anche la soluzione di seguito sul sito del forum di jquery. https://forum.jquery.com/topic/how-to-set-minimum-and-maximum-date-dynamically-in-jquery-ui-date-picker

$.datepicker.setDefaults({ 
      showOn: 'button', 
      buttonImage: 'images/calendar.gif', 
      buttonImageOnly: true, 
      dateFormat: 'yy-mm-dd', 
      minDate: '2013-09-10', 
      maxDate: '2013-10-10' 
    }); 
    $('#frm_date').datepicker({ 
      onSelect: function(selectedDate) { 
       $('#to_date').datepicker('option', 'minDate', selectedDate || '2013-09-10'); 
      } 
    }); 
    $('#to_date').datepicker({ 
      onSelect: function(selectedDate) { 
       $('#frm_date').datepicker('option', 'maxDate', selectedDate || '2013-10-10'); 
      } 
    }); 

    $(".datepick").datepicker({dateFormat:'yy-mm-dd',minDate:'2013-09-10' ,maxDate:'2013-10-10'}); 
0

È possibile chiamare beforeShow metodo per impostare un'opzione poco prima che venga visualizzato il calendario:

$("#to_date").datepicker({ 
    beforeShow:function(){ 
     $(this).datepicker('option', 
          { 
           minDate:new Date() 
          } 
         ); 
    } 
}); 
Problemi correlati