Buotons radios avec validation par boite de dialogue

**alexbubs** · 15/10/2005, 17h27

Bonjour,

Je suis débutant et je galere un petit peu dans les formulaires avec des boutons radios.
Je souhaiterai lorsque l'utilisateur selectionne la reponse 4807 M et lorsqu'il clique sur le bouton "essayer" qu'une boite de dialogue lui retourne "gagné" et si il s'est trompé "perdu".
De plus j'ai l'impression qu'une fois mes boutons sont cochés on ne peut plus les décochés... D'ou cela vient-il ??
Merci a vous.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
</script>
</head>
 
<body>
<font size="+1"><strong>A propos du Mont Blanc</strong></font> 
<Form name="form1">
Altitude <Br><Br>
4807 M : <INPUT type="radio" name="4807 M"><br><br>
4708 M : <INPUT type="radio" name="4708 M"><br><br>
4810 M : <INPUT type="radio" name="4810 M"><br><br>
<input type="button" value="Essayer" onClick="window.alert(form1.4807 M.checked)">
</Form>
</body>
</html>

**Mr N.** · 15/10/2005, 19h13

Plusieurs choses :

Evite les espaces dans les attributs name
les radio doivent faire parti d'un groupe de radio... or ici 1 group = 1 radio donc on peut selectionner toutes les reponses à la fois. Ce qui n'est pas leprincipe des radios. On definit un group par le name : en clair, même name = même groupe
On ne peut deselectionner un radio car pour ce faire, il faut selectionner un autre radio dans le meme groupe, our vu le point ci-dessus, c'est impossible
les radio se mettent généralement à gauche du label, remarque purement falcutative et subjective

**alexbubs** · 16/10/2005, 00h11

Ok merci de ta réponse. J'ai essayaer de corriger mon code suite aux indications que tu m'as donnés. Desormais un seul bouton peut etre coché ; le probleme de selection est donc reglé. Reste le renvoi de la reponse dans la boite de dialogue que je ne parviens toujours pas a généré.

Voici mon nouveau code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
</script>
</head>
 
<body>
<font size="+1"><strong>A propos du Mont Blanc</strong></font> 
<Form name="form1">
Altitude <Br><Br>
4807m : <INPUT type="radio" name="Altitude"><br><br>
4708m : <INPUT type="radio" name="Altitude"><br><br>
4810m : <INPUT type="radio" name="Altitude"><br><br>
<input type="button" value="Essayer" onClick="window.alert(form1.4807m.checked)">
</Form>
</body>
</html>

Merci pour votre aide.

**Mr N.** · 16/10/2005, 13h18

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
   var reponses = new Array;
 
   function checkAnswer(question, user_choice) {
      if (user_choice[reponses[question]] && user_choice[reponses[question]].checked) {
         alert('Bonne réponse !');
      } else {
         alert('Vous êtes le maillon faible, au revoir');
      }
   }
</script>
</head>
 
<body>
<strong>A propos du Mont Blanc</strong>
<form name="form1">
<div>
   <p>Altitude :</p>
   <INPUT type="radio" name="Altitude" id="Altitude_0" /> <label for="Altitude_0">4807m</label><br>
   <INPUT type="radio" name="Altitude" id="Altitude_1" /> <label for="Altitude_1">4708m</label><br>
   <INPUT type="radio" name="Altitude" id="Altitude_2" /> <label for="Altitude_2">4810m</label><br>
   <script type="text/javascript">reponses['altitude'] = 2;</script>
   <input type="button" value="Essayer" onClick="checkAnswer('altitude', form1.Altitude);">
</div>
<div>
   <p>Couleur :</p>
   <INPUT type="radio" name="Couleur" id="Couleur_2" /> <label for="Couleur_2">blanc</label><br>
   <INPUT type="radio" name="Couleur" id="Couleur_0" /> <label for="Couleur_0">rouge</label><br>
   <INPUT type="radio" name="Couleur" id="Couleur_1" /> <label for="Couleur_1">noir</label><br>
   <script type="text/javascript">reponses['couleur'] = 0;</script>
   <input type="button" value="Essayer" onClick="checkAnswer('couleur', form1.Couleur);">
</div>
</form>
</body>
</html>

**alexbubs** · 16/10/2005, 19h21

Ok, j'ai essayer le code et ca marche parfaitement.
Je vais etudier tout ca pour comprendre un peu comment ca marche.

Merci pour ton aide.

Bonne continuation.

Buotons radios avec validation par boite de dialogue

JavaScript

Vue hybride

Discussions similaires

Partager

Partager