jQuery UI Datepicker Ajouter des Jours

Je suis d'essayer de créer quelque chose de gamme système de réservation de salles sur un site de l'hôtel et je suis en utilisant jQuery UI Datepicker pour permettre à l'utilisateur de choisir leur date d'arrivée. Ce que je veux faire est de créer un autre champ qui est simple "le Nombre de Nuits" et ont Datepicker de jQuery prendre la date d'arrivée, ajouter le nombre de nuits et de définir la date obtenue comme valeur caché d'une entrée (dans le bon format de date). Il ressemblerait à quelque chose comme ceci:

<input type="text" name="arrivalDate" class="datepicker">
<input type="text" name="numOfNights">
<input type="hidden" name="departureDate" value="arrivalDate + number of nights">

Est-ce possible? Merci à l'avance.

(Note: La base de données, je vais être "get"-ing avec ce formulaire est un peu capricieux et je n'ai pas accès à elle au-delà de quelques requêtes en mesure de valeurs.)

OriginalL'auteur Andrew | 2010-09-28

  1. 9

    Ci-dessus peut être obtenu en suivant le code -

     $('input[name="arrivalDate"]').datepicker({

     //your other configurations.     

     onSelect: function(){
     var start = $('input[name="arrivalDate"]').val();
     var nights = $('input[name="numOfNights"]').val();
     var date = new Date(start);
     var d = date.getDate();
     var m = date.getMonth();
     var y = date.getFullYear();
     var edate= new Date(y, m, d+nights);
     $('input[name="departureDate"]').val(edate);
    }
 });
    Je viens d'essayer ton code et c'est bien, mais je suis venu avec un plein format de la date de signification:"Mon Sep 15 2014 00:00:00 GMT+0200 (Hora de verano romance)" je veux juste le jj/mm/aa format, mais je ne peux pas compris, je vais aprécier un peu d'aide merci!

    OriginalL'auteur Alpesh

  2. 6

    Vous pouvez mettre à jour la valeur du champ caché dans le onSelect événements pour la arrivalDate datepicker.

    $('#arrivalDate').datepicker({
    onSelect: function(dateStr) {
        var nights = parseInt($('#numOfNights').val());
        var depart = $.datepicker.parseDate('mm/dd/yy', dateStr);
        depart.setDate(depart.getDate() + nights);
        $('#departureDate').val(depart);
     }
});

    Vous devrez également mettre à jour le departureDate de champ à partir de l'événement de changement de la numOfNights champ.

    $('#numOfNights').change(function() {
        var nights = parseInt($('#numOfNights').val());
        var depart = $.datepicker.parseDate('mm/dd/yy', $('#arrivalDate').val());
        depart.setDate(depart.getDate() + nights);
        $('#departureDate').val(depart);
});

    Essayer ici: http://jsfiddle.net/JKGvD/

    Vous voudrez probablement faire une fonction et également l'utiliser pour initialiser le departureDate si votre arrivalDate a une valeur initiale.

    OriginalL'auteur RememberME

  3. 1

    Utiliser le setDate fonction.

    setDate

    Signature:
    .datepicker( "setDate" , date )

    Définit la date actuelle pour la
    datepicker. La nouvelle date peut-être un Jour
    objet ou une chaîne de caractères dans le courant de la date
    format (par exemple '01/26/2009'), un certain nombre
    de jours à partir d'aujourd'hui (par exemple, +7) ou un
    chaîne de valeurs et des périodes ('y' pour
    ans, " m "pendant des mois," w " pendant des semaines,
    "d" pour les jours, par exemple '+1m +7d), ou null
    pour effacer la date sélectionnée.

    OriginalL'auteur JasCav