Formulaire - case cochée => nouveaux champs

Version imprimable

26/10/2008, 09h52
corambe84

Formulaire - case cochée => nouveaux champs

Bonjour à tous,

J'ai créé un formulaire de réservation de randonnées sur mon site ( www.corambe.com/randos/réservation.html ).
Je voudrais le modifier, l'améliorer. Je sais que cela existe mais je n'arrive pas à trouver comment mettre en place cette fonction, ni avec google ni avec la fonction 'Rechercher'.
Voilà ce que je cherche à obtenir : si on coche la case 1 (parmi un choix de 5), on aura d'autres champs, particuliers à cette case, qui apparaîtront en dessous. Et ça pour chacune des cases à cocher.
Savez vous comment faire ça?
J'ai pensé mettre un lien vers une autre page comprenant les champs correspondant au bouton coché, mais ça pose le problème de l'apparition de la nouvelle page à un certain niveau dans la fenêtre (ça, ça ne doit pas être trop compliqué...), mais surtout qu'il faudrait que dans la nouvelle page ouverte, les champs déjà renseignés soient inscrits dans les champs (que le visiteur n'ait pas à les retaper).
Svp aidez moi... !!!
Merci d'avance !

Fonction

Salut,

Moi j'ai fais ça sur un de mes formulaires.

Code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<script language="JavaScript" type="text/javascript">
 
 
function afficher(theid)
{
 
  document.getElementById(theid).style.display = 'block';
}
 
function cacher(theid)
{
 
document.getElementById(theid).style.display = 'none';
 
}
</script>
<body>
<table width="613" border="0">
  <tr>
    <td width="210" class="Style5"><div align="left">Avez-vous des enfants ?</div></td>
    <td width="202" class="Style5"><div align="center">
        <input type="radio" name="enfants" value="OUI" onClick="afficher('enfant')" />
        OUI &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <input type="radio" name="enfants" value="NON" onClick="cacher('enfant')" />
        NON</div></td>
    <td width="30" class="Style5">&nbsp;</td>
    <td width="153" class="Style5">&nbsp;</td>
  </tr>
  <tr>
    <td width="210" height="38" class="Style5"><div align="left">Si oui, le nombre :</div></td>
    <td colspan="3" class="Style5"><div id="enfant" style="display: none">
        <table width="309" border="0">
          <tr>
            <td width="82"><div align="center">
                <input type="radio" name="nombre" value="1" />
                <span class="Style5">1 </span></div></td>
            <td width="60"><input type="radio" name="nombre" value="2" />
              <span class="Style5"> 2</span></td>
            <td width="52"><input type="radio" name="nombre" value="3" />
              <span class="Style5">3</span> </td>
            <td width="85"><input type="radio" name="nombre" value="4 et +" />
              <span class="Style5"> 4 et +</span></td>
          </tr>
        </table>
      </div></td>
  </tr>
</table>
</body>
</html>

A +,

Cireultra

Bon donc depuis hier j'ai avancé, réussi à mettre des div que je cache ou pas, donc le problème dont je parlais hier est complètement résolu.
Par contre, j'ai utilisé le modèle du formulaire de Calak, qui est très bien, mais j'ai encore un souci par rapport à ça :
Quand je reçois le mail, tous les champs sont renseignés, sauf celui des input type radio, où à la place de la valeur, il y a marqué :'array'.
Je ne comprend pas du tout pourquoi ni ce que je peux faire pour changer ça...

Je vous met le code à cet endroit.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <fieldset> <legend>Choix d'une randonnée</legend> <label for="formule8"><span>Balade de 45 minutes</span> <input name="formule[]" id="formule8" value="8" type="radio"></label><label for="formule1"><span>Balade d'une heure et demie</span> <input name="formule[]" id="formule1" value="1" type="radio"></label><label for="formule2"><span>Balade d'une demie journée</span> <input name="formule[]" id="formule2" value="2" type="radio"></label><label for="formule3"><span>Randonnée d'une journée</span> <input name="formule[]" id="formule3" value="3" type="radio"></label><label for="formule4"><span>Randonnée d'un week-end</span> <input name="formule[]" id="formule4" value="4" type="radio"></label><label for="formule5"><span>Journée gastronomique</span> <input name="formule[]" id="formule5" value="5" type="radio"></label><label for="formule6"><span>Randonnée anniversaire</span> <input name="formule[]" id="formule6" value="6" type="radio"></label><label for="formule7"><span>Balade botanique</span> <input name="formule[]" id="formule7" value="7" type="radio"></label></fieldset>
J'ai essayé de mettre des valeurs entre les crochets de "formule[]", mais ça ne change rien...