JQuery datepicker - 2 entrées/zones de texte

Question

Deux zones de saisie: lorsque je règle la première, je veux que la seconde soit un jour après la date sélectionnée dans la première. J'utilise le plugin jquery de Keith Wood: http://keith-wood.name/datepickRef.html. Utilisation altField: conserve simplement le même dans les deux champs, mais je veux obtenir 1 jour après dans le deuxième champ de saisie.

Answer 1

Jetez un oeil à ma réponse ici - JQuery datepicker- 2 inputs/textboxes and restricting range

Une façon de le faire serait d'utiliser la propriété beforeShow pour limiter la valeur dans la seconde datepicker. Vous pouvez également définir un gestionnaire onSelect qui met à jour la deuxième entrée lorsqu'une date est choisie dans la première.

Working DemoNote: ceci est basé sur la jQuery DatePicker et non Keith Woods'.

EDIT:

Comme indiqué sur la datepick plugin page -

Ce plugin est la base pour la jQuery UI Datepicker. Il est fait disponible en tant que plugin séparé depuis l'équipe de l'interface utilisateur a souhaité la fonctionnalité simplifiée pour leur version.

ainsi le code basé sur la Datepicker jQuery UI travaillera avec le datepicker de Keith.

code de démonstration

$(function() 
{ 

    $('#txtStartDate, #txtEndDate').datepicker(
    { 
     showOn: "both", 
     dateFormat: "dd M yy", 
     onSelect: insertOtherDate, 
     firstDay: 1, 
     changeFirstDay: false 
    }); 
}); 

function insertOtherDate(value, date, inst) { 

    var firstDate = new Date(value); 
    var datepickerInput = (date.id === 'txtStartDate') ? 'txtEndDate' : 'txtStartDate'; 
    var dateAdjust = (date.id === 'txtStartDate') ? 1 : -1; 
    var secondDate = new Date(firstDate.getFullYear(), firstDate.getMonth(), firstDate.getDate() + dateAdjust); 

    $('#' + datepickerInput).datepicker('setDate', secondDate); 
} 

Answer 2

Définir un gestionnaire onSelect qui met à jour le deuxième champ avec une date qui est un plus tard que celle choisie pour le premier champ.

Answer 3

Créez un événement onSelect à partir de l'outil datepicker. Dans le rappel, lisez la valeur, convertissez la date en UNIX TIMESTAMP (vous pouvez utiliser $ .datepick.TIMESTAMP), ajoutez 24 * 60 * 60000 et configurez la seconde entrée en conséquence.