Discussion :

[moimp]

Bonjour,

Après avoir parcouru plusieurs forums et consulté la FAQ javascript de ce site, je ne m'en sors pas.
Voici mon code html simplifié:

Code html :

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

1
2
3
4
5
6
7
<form id="form3" method="post" class="M" action="test.php">
	<fieldset><legend>Situation administrative</legend>
		<label for="permis_conduire">Permis de conduire</label><input type="radio" name="permis_conduire" id="aucun" value="aucun"<?= $permisNo ?> /><label for="aucun">Aucun</label><br/>
		<label for=""></label><input type="radio" name="permis_conduire" id="oui" value="oui"<?= $permisYes ?> /><label for="oui">Oui</label><br/>
	</fieldset>
	<p><input type="submit" value="Valider" /></p>
</form>

et le code JS correspondant:

Code javascript :

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
const	form3 			= document.getElementById('form3'),
		permis			= form3.querySelector("[name='permis_conduire']"),
		messageDeb		= "Vous n'avez pas renseigné le champ \"",
		messageFin		= "\". Bien que facultatif, cet élément est important.\nVous devrez le renseigner ultérieurement";
 
form3.addEventListener('submit', function(e) {
	console.log(permis);
	if (permis === null) {
		alert(messageDeb+"Permis de conduire"+messageFin);
	}
	if (! permis.checked) {
		alert(messageDeb+"Permis de conduire"+messageFin);
	}
	if (! permis['oui'].checked && ! permis['non'].checked) {
		alert(messageDeb+"Permis de conduire"+messageFin);
	}
	e.preventDefault(); // Pour test uniquement
 
}, false);

Je ne comprends pas pourquoi ma variable permis est toujours nulle et provoque des erreurs.

[Beginner.]

Salut,

Je ne suis pas un connaisseur des formulaires et de la meilleure façon de gérer des boutons radios mais je vois quand même beaucoup de choses qui ne vont pas dans le code...

Je ne comprends pas pourquoi ma variable permis est toujours nulle et provoque des erreurs.

- Elle n'est pas nulle, après l’instruction permis = form3.querySelector("[name='permis_conduire']") la variable "permis" pointe sur le premier bouton (sur le premier élément dont le name est "permis_conduire")...

Par contre si tu utilises querySelectorAll("[name='permis_conduire']") (il y a "All" en plus) la variable "permis" sera un tableau de deux éléments (les deux boutons)...

- Comme veux-tu distinguer les différents cas si tu envois à chaque fois le même message : alert(messageDeb+"Permis de conduire"+messageFin); ?

Je laisse la suite aux autres...

[moimp]

Oui merci, c'est bien le All qui me manquait. Je faisais une confusion entre le nom 'permis' et les valeurs des boutons radio. Par contre mon message est correct: Il indique qu'aucun bouton n'a été sélectionné.

[Beginner.]

Par contre mon message est correct: Il indique qu'aucun bouton n'a été sélectionné.

Oui mais tu n'as pas besoin de trois conditions (avec if) pour ça... Les deux premières ne font pas ce que tu crois...


Et je ne sais pas ce que ça donne ça : permis['oui'].checked et ça permis['non'].checked, cela ne me semble pas correcte à première vue... *
Ca marche comme tu veux ?

Sinon essaye plutôt ça : permis[0].checked et ça permis[1].checked...


- Et j'ai lu que dans le for des labels il faut mettre le id des imput correspondants....