jquery datepicker ui ordre des opérations

Question

j'ai fait une jsFiddle que je ne sais pas si je vais vous expliquer ce bien: http://jsfiddle.net/jrrbg/

Fondamentalement, je veux choisir une date dans la première zone d'entrée et l'afficher dans la deuxième un mais avec une date une semaine plus tôt.

<p>Match Date<br /> 
     <input name="seatt_expire" type="text" class="datepicker" id="seatt_expire" /> 
    </p> 

<p>Opening Registration<br /> 
     <input name="seatt_start" type="text" class="datepicker" id="seatt_start" /> 
</p> 

$(function() { 

$(".datepicker").datepicker({ 

dateFormat: "dd-mm-yy", 
firstDay: 1, 
altField: "#seatt_start" 
}); 


$("#seatt_start").datepicker("setDate", -7); 

}); 

Il prend actuellement la date par défaut et la définit 7 jours plus tôt au lieu d'utiliser la date dans la première zone.

Answer 1

Le problème avec votre approche est que $("#seatt_start").datepicker("setDate", -7); fixe la date à 7 jours moins aujourd'hui, pas la date précédente, aussi ne déclenche rien lorsque la date de seatt_expire modifications, vous devez utiliser l'événement onSelect.

Essayez quelque chose comme ceci:

jQuery(function() { 
    $("#seatt_start").datepicker({dateFormat: "dd-mm-yy"}); 
    $("#seatt_expire").datepicker({ 
     dateFormat: "dd-mm-yy", 
     firstDay: 1, 
     onSelect: function (prev_date) { 
      prev = prev_date.split("-"); 
      var date = new Date(prev[2], prev[1] - 1, prev[0]); 
      var d = date.getDate(); 
      var m = date.getMonth(); 
      var y = date.getFullYear(); 
      var new_date = new Date(y, m, d - 7); 
      $("#seatt_start").removeAttr("disabled").datepicker("setDate", new_date); 
     } 
    }); 
}); 

Ici, la date de seatt_expire est soustrait, puis analysé pour soustraire les 7 jours que vous voulez, et la date de seatt_start changeront le long chaque fois, aussi je me suis séparé à la fois déclarations datepicker pour éviter le même événement onSelect à appliquer aux deux champs ...

JSFiddle Demo

Answer 2

Voici comment vous pouvez le faire: fiddle

$("#seat-expire").datepicker({ 
    dateFormat: "dd-mm-yy", 
    firstDay: 1, 
    onSelect:function(text,obj){ 
     var dateObject = $(this).datepicker("getDate"); 
     dateObject.setDate(obj.currentDay-7); 
     $("#seat-start").datepicker("setDate",dateObject); 
    } 
}); 

Si nécessaire même pourrait être appliqué à #seat-start que dans le sens inverse:

$("#seat-start").datepicker({ 
     dateFormat: "dd-mm-yy", 
     firstDay: 1, 
     // display expire date 
     onSelect:function(text,obj){ 
      var dateObject = $(this).datepicker("getDate"); 
      dateObject.setDate(obj.currentDay+7); 
      $("#seat-expire").datepicker("setDate",dateObject); 
     } 
    });