Controle JS : détecter si un bouton radio est coché

Version imprimable

Voir 40 message(s) de cette discussion en une page

Bonjour,
Étant d'un touuuuut petit niveau en JS je bloque sur un truc à priori simple : j'ai un script qui vérifie si mes boutons radio sont cochés.
S'ils ne le sont pas une alerte apparait "'Vous devez sélectionner un choix ..." mais en cliquant sur le OK de la fenêtre le formulaire se valide quand même...
Comment l'en empêcher ?
Merci à vous.
Code:

1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript"> function ChkTransport() { var n = document.choixtrans.transport.length; var res = false; for (i=1;i<=n;i++) if(document.getElementById(i).checked == true) return true; if (res == false) alert('Vous devez sélectionner un choix ...'); } </script>

11/12/2014, 14h46
SpaceFrog

http://www.developpez.net/forums/d55...on-formulaire/

Je suis désole je ne vois pas comment adapter
Code:

1 2 3 4 5 6 7 8 ... if (res == false) alert('Vous devez sélectionner un choix ...'); return false; } else { return true; }
Et ca ne fonctionne plus du tout

11/12/2014, 15h01
SpaceFrog

tu as mis un return dans le onsubmit ?
11/12/2014, 15h05
Gaetan_

Merci pour ta réponse.

J'essaye de diverses façon même en

Code:

<form method="post" action="commande4.php" OnSubmit='return ChkTransport()'>
11/12/2014, 15h08
Bovino

Tu devrais prendre l'habitude d'entourer tes boucles et tes conditions d'accolades, ça rend bien service...

J'essaye plusieurs solutions maintenant j'ai le message même quand un radio est coché :(

Code:

1
2
3
4
5
6
7
8
9
10
11
function ChkTransport() {
	var n = document.choixtrans.transport.length;
	var res = false;
	for (i=1;i<=n;i++)
		if(document.getElementById(i).checked == true) {
		return true;
		} else {
		alert('Vous devez sélectionner un choix ...');
		return false;
		}
  }

11/12/2014, 15h26
SpaceFrog

là c'est parce que tu return dès le premier check true ...
incrémente une variable et teste là après la boucle
11/12/2014, 15h29
Bovino

Oui, mais là, ça ne relève plus de JavaScript mais de l'algo...

Tu fais une boucle sur tous tes boutons radio.
A chaque itération, si le bouton est coché, tu renvoies vrai, sinon tu affiches un message et tu renvoies faux.

Ensuite, dans un grand nombre de langages de programmation, que se passe-t-il lors de l'appel de l'instruction return ?

En gros, ce que tu fais est juste de vérifier si le premier radio est coché ou non...

Et au passage

Citation:

Tu devrais prendre l'habitude d'entourer tes boucles et tes conditions d'accolades, ça rend bien service...
11/12/2014, 15h31
Bovino

Citation:

incrémente une variable et teste là après la boucle

Même pas besoin en fait.
Dans la boucle, si le bouton radio testé est coché, tu renvoies true. Ensuite, si tu sors de la boucle, c'est qu'aucun bouton n'était coché et il suffit de renvoyer false. ;)

Merci à vous.
Je revoie ma copie j'arrive à :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
function ChkTransport() {
	var n = document.choixtrans.transport.length;
	var res = false;
	for (i=1;i<=n;i++) {
		if(document.getElementById(i).checked == true) {
		res=true;
		} 
	}
	if(res==false){
	alert('Vous devez cocher une case!');
	return false;
	}
}

Cela fonctionne est ce correct à tous niveaux ?
Merci

Code:

1
2
3
4
5
6
7
8
9
10
function ChkTransport() {
	var n = document.choixtrans.transport.length;
	for (i=1;i<=n;i++) {
		if(document.getElementById(i).checked == true) {
		return true;
		} 
	}
	alert('Vous devez cocher une case!');
	return false;
}

Sinon, tes input ont des id numériques ?

plus universel:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function ChkTransport() {
	var n = document.choixtrans.transport.length;
	var res = 0;
	for (i=1;i<=n;i++) {
		if(document.getElementById(i).checked == true) {
		res++;
		} 
	}
 
	if(res==0){
	alert('Vous devez cocher une case!');
	return false;
	}
 
        return true;
 
}

11/12/2014, 16h10
Gaetan_

Oui mes IDs sont numériques.

Un grand merci pour vos lumières et votre aide.

Spaffy, il est question de boutons radio, il ne peut y en avoir qu'un seul maxi de coché, le compteur ne sert pas à grand chose. ;)
Sinon, une version sans avoir besoin d'id :
Code:

1 2 3 4 5 6 7 8 9 10 11 function ChkTransport() { var elems = document.choixtrans.transport, n = elems.length; for (i=1;i<=n;i++) { if(elems[i].checked) { return true; } } alert('Vous devez cocher une case!'); return false; }

11/12/2014, 16h28
SpaceFrog

plus universel => autre chose que des radios ... ;)
11/12/2014, 16h30
Gaetan_

Seul Chrome ne supporte pas visiblement grrrrr
11/12/2014, 16h46
Bovino

Il n'y a aucune raison à priori...
Montres-nous ton code (JavaScript + HTML associé) pour qu'on puisse voir ton erreur.
11/12/2014, 16h52
SpaceFrog

Je ne sais pas si c'est toujours d'actualité, mais à une époque les id strictement numériques ou commençant par du numérique étaient à proscrire ...
11/12/2014, 16h55
Bovino

C'est autorisé par HTML5, à priori, JavaScript ne pose pas de problème, en revanche, CSS ne les prend pas en compte. ;)

Voir 40 message(s) de cette discussion en une page