2010-05-20 3 views
0

J'écrit comme ça ..

Rien ne se passe lors de la définition de minDate dans jquery datepicker?

<script> 


$(function() { 
        $('#from').datepicker({ 
          defaultDate: "+5d", 
          changeMonth: true, 
          numberOfMonths:1 , 
          minDate:"+0d", 
          dateFormat: 'DD, MM d, yy', 
          onSelect: function(selectedDate) { 
            var option = this.id == "from" ? "minDate" : "maxDate"; 

            var instance = $(this).data("datepicker"); 

            var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 


            dates.not(this).datepicker("option", option, date); 

          } 
        }); 

}); 

$(function() { 
    $('#to').datepicker({ 
          defaultDate: "+5d", 
          changeMonth: true, 
          numberOfMonths:1 , 
          minDate:"+0d", 
          dateFormat: 'DD, MM d, yy', 
          onSelect: function(selectedDate) { 
            var option = this.id == "from" ? "minDate" : "maxDate"; 

            var instance = $(this).data("datepicker"); 

            var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 


            dates.not(this).datepicker("option", option, date); 

          } 
        }); 
}); 

function callme(id){ 
    var temp1 = "#" + id; 
    if(temp1 == "#from"){ 
     $("#to").unbind(); 
    } 
    else{ 
     var temp = $("#from").val(); 
     var msecsInADay = 86400000; 
     var startDate = new Date(temp); 
     var endDate = new Date(startDate.getTime() + msecsInADay); 
     var t = endDate.getDate() + '/' + (endDate.getMonth()+1) + '/' + endDate.getFullYear(); 

     $('#to').datepicker({minDate: new Date(t)}); 
     $('#to').datepicker().datepicker("show"); 
    } 
} 
</script> 


</head> 

<body> 
    <label>date</label><input id="from" type="text" onclick="callme(this.id)"/> 
    <label>return</label><input id="to" type="text" onclick="callme(this.id)" /> 


Maintenant, ce que je veux est ....
lorsque je sélectionne la première date. [signifie sur "#from"] avant que les dates d'aujourd'hui ne soient désactivées dans le calendrier.
maintenant lorsque je sélectionne la deuxième date [signifie sur "#to"] dans la date du calendrier devrait commencer un jour plus. puis date précédente.

Mais ici, la date minimale n'a pas changé.

merci à l'avance ...

Répondre

1

Si je comprends votre question (et le code, car le code fourni fait plus que vos spécifications) que vous voulez le comportement suivant:

  1. Lorsqu'une date, F, dans #from est sélectionné, vous ne devez sélectionner que les dates supérieures à F dans #to.
  2. Lorsqu'une date, T, en #to est sélectionné, aucune date supérieure ou égale à T devrait être sélectionnable dans #from

Ce code fera ceci:

$(function() { 
    $('#from').datepicker({ 
     defaultDate: '+5d', 
     changeMonth: true, 
     numberOfMonths:1, 
     minDate:'+0d', 
     dateFormat: 'DD, MM d, yy', 
     onClose: function(dateText, inst) { 
      if (dateText !== '') { 
       try { 
        var fromDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings); 
        fromDate.setDate(fromDate.getDate() + 1); 
        $('#to').datepicker('option', 'minDate', fromDate); 
       } 
       catch (err) { 
        console.log(err); 
       } 
      } 
      else { 
       //If #from is empty, restore the original limit in #to 
       $('#to').datepicker('option', 'minDate', '+0d'); 
      } 
     } 

    }); 

    $('#to').datepicker({ 
     defaultDate: '+5d', 
     changeMonth: true, 
     numberOfMonths:1, 
     minDate:'+0d', 
     dateFormat: 'DD, MM d, yy', 
     onClose: function(dateText, inst) { 
      if (dateText !== '') { 
       try { 
        var toDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings); 
        toDate.setDate(toDate.getDate() - 1); 
        $('#from').datepicker('option', 'maxDate', toDate); 
       } 
       catch (err) { 
        console.log(err); 
       } 
      } 
      else { 
       //If #to is empty, remove the limit in #from 
       $('#from').datepicker('option', 'maxDate', null); 
      } 
     } 
    }); 
}); 

Les deux onClose fonctions sont assez similaires et pourraient être généralisées en une seule fonction, mais je pense qu'il est plus facile de comprendre ce qui se passe de cette façon.

De plus, le gestionnaire onClick n'est plus nécessaire dans #from ou #to.

Questions connexes