Fonction onUpdate et dhtml calendrier

Bonjour,

Je suis en train de faire un formulaire de réservation. Jusqu'à présent j'utilise des input reliés à un script javascript pour afficher un petit calendrier.

J'aimerai deux choses qu'il soit impossible pour un visiteur de sélectionner une date antérieure à la date d'arrivée. Et que la date de départ (date d'arrivée +1jours) s'inscrive automatiquement quand l'utilisateur choisi sa date d'arrivée.

J'utilise ce calendrier : The DHTML Calendar - www.dynarch.com/projects/calendar

Ils utilisent la fonction onUpdate, j'ai beau cherché sur leur site, la documentation n'est pas très explicite
Voilà leur exemple :

<form action="#" method="get">
<input type="text" name="date" id="f_date_a" />
<input type="text" name="date" id="f_calcdate" />
</form>

<script type="text/javascript">
    function catcalc(cal) {
        var date = cal.date;
        var time = date.getTime()
        // use the _other_ field
        var field = document.getElementById("f_calcdate");
        if (field == cal.params.inputField) {
            field = document.getElementById("f_date_a");
            time -= Date.WEEK; // substract one week
        } else {
            time += Date.WEEK; // add one week
        }
        var date2 = new Date(time);
        field.value = date2.print("%Y-%m-%d %H:%M");
    }
    Calendar.setup({
        inputField      :    "f_date_a",   // id of the input field
        ifFormat        :    "%Y-%m-%d %H:%M",       // format of the input field
        showsTime       :    true,
        timeFormat      :    "24",
        onUpdate        :    catcalc
    });
    Calendar.setup({
        inputField     :    "f_calcdate",
        ifFormat       :    "%Y-%m-%d %H:%M",
        showsTime      :    true,
        timeFormat     :    "24",
        onUpdate       :    catcalc
    });
</script>

voilà mon code à moi pour l'instant :

<!-- choix des dates d'arrivee-->
<p>
<label for="arrival_input_2">Od dnia : </label><br>
<input id="arrival_input_2" name="arrival_day" class="input_date" size="2" maxlength="2" value="dd" type="text"> -
<input id="arrival_input_1" name="arrival_month" class="input_date" size="2" maxlength="2" value="mm" type="text"> -
<input id="arrival_input_3" name="arrival_year" class="input_date" size="4" maxlength="4" value="rrrr" type="text">
<img id="calendar_arrival_img" class="datepicker" src="medias/img/calendar.gif" alt="Pick a date.">
<script type="text/javascript">
Calendar.setup({
inputField	 : "arrival_input_3",
baseField    : "arrival_input",
displayArea  : "calendar_arrival",
button	  : "calendar_arrival_img",
onSelect	 : selectDate
});
</script>
</p>
<!-- choix des dates de depart-->
<p>
<label for="departure_input_2">Do dnia : </label><br>
<input id="departure_input_2" name="departure_day" class="input_date" size="2" maxlength="2" value="dd" type="text"> -
<input id="departure_input_1" name="departure_month" class="input_date" size="2" maxlength="2" value="mm" type="text"> -
<input id="departure_input_3" name="departure_year" class="input_date" size="4" maxlength="4" value="rrrr" type="text">
<img id="calendar_departure_img" class="datepicker" src="medias/img/calendar.gif" alt="Pick a date.">
<script type="text/javascript">
Calendar.setup({
inputField	 : "departure_input_3",
baseField    : "departure_input",
displayArea  : "calendar_departure",
button	  : "calendar_departure_img",
onSelect	 : selectDate
});
</script>
</p>

J'ai essayé de faire pareil en modifiant leur exemple, mais ça ne marche pas.

Je n'ai jamais fait de Java de ma vie, alors je sais même pas où chercher. Si vous connaissez un forum pour ce calendrier, ou si certains l'utilisent, ça serait sympa de m'aiguiller

Merci de votre aide et bon week-end

http://3couleurs.eu/NOVELLO/
Modifié par tabaluga72 (21 Feb 2009 - 03:17)