Recuperer les éléments d'une checkbox si checked

Version imprimable

Bonjour,

Je ne comprends pas pourquoi j'ai l'erreur suivante =>

Citation:

SCRIPT5007: La valeur de la propriété « afficherMessage » est null ou non définie, pas un objet Function
testJSChap2 - Copie.html, Ligne 45 Caractère 42

Code:

1
2
3
4
5
6
7
8
9
10
11
function afficherMessage()
{
	var cases = document.getElementById("idForm").mesCases;
	var platsFavoris=new Array();
	for (var i=0; i<cases.length;i++)
		if (cases[i].checked)
			platsFavoris+=cases[i].value;
		for (var i=0;i<platsFavoris.length;i++)
			var lesPlats+= ((platsFavoris[i].value) +', ');
	return alert(lesPlats);
}

Code:

1
2
3
4
5
6
7
8
9
10
11
<body>  <!-- corps du document -->
 
<form id="idForm">
Vous aimez : <br />
<input type="checkbox" name="mesCases" value="pizza" />la pizza <br />   
<input type="checkbox" name="mesCases" value="tartiflette" /> la tartiflette <br />
<input type="checkbox" name="mesCases" value="ratatouille" /> la ratatouille <br />   
<input type="button" value="Ok" onclick="afficherMessage()" /> 
</form>
 
</body>

18/09/2013, 15h12
Bovino

Code:

platsFavoris+=cases[i].value;

Tu additionnes un tableau et une valeur textuelle ? :koi:
18/09/2013, 15h22
eliottgiraudo

suite

euh ^^ comment rajouter un élément dans un tableau à chaque tour de boucle ? Juste faire "=" ?
ou alors

Code:

platsFavoris.push(cases[i].value);

ça marche pas non plus (en tout cas il y a toujours la même erreur qu'indiqué dans mon premier message et rien d'indiqué pour cette ligne)

Merci pour ton aide
18/09/2013, 15h39
Bovino

Code:

var lesPlats+= ((platsFavoris[i].value) +', ');

Un élément de tableau n'a pas de propriété value...

Code:

return alert(lesPlats);

C'est pas très orthodoxe ça...
alert() ne correspond pas à une valeur... donc ce que tu retournes ne correspond pas à grand chose.
18/09/2013, 16h01
eliottgiraudo

suite

Ok c'est pour ça que je propose :

Code:

platsFavoris.push(cases[i].value);

mais cela ne fonctionne pas.

Pour alert j'ai suivi des tuto ou on pouvait mettre du texte dans une variable x et retourner x dans la fonction.

Je suis un peu perdu là, je ne vois pas vers quoi aller ?

MERCI.
18/09/2013, 18h55
NoSmoking
Bonjour,

Citation:

mais cela ne fonctionne pas.

lourd à parier que tu n'as pas réaliser toutes les modifications dans ton code
Code:

1 2 3 4 5 6 7 var cases = document.getElementById("idForm").mesCases; var platsFavoris= []; for (var i=0; i<cases.length;i++){ if (cases[i].checked){ platsFavoris.push(cases[i].value); } }
dans ce code tu transfères dans le tableau platsFavoris la valeur de la case si elle est cochée.

Maintenant je ne vois pas bien l'intérêt de la 2éme boucle for, si ce n'est transférer le tableau platsFavoris dans le tableau lesPlats.

suite

Bonjour,

J'ai bien modifié le code ça ne fonctionnait pas, j'ai donc enlevé la boucle comme tu disais et j'ai essayé de mettre ds une variable à chaque tour de boucle la valeur des boutons cochés...
ça ne fonctionne tjrs pas...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function afficherMessage()
		{
			var cases = document.getElementById("idForm").mesCases;
			var platsFavoris=new Array();
 
			for (var i=0; i<cases.length;i++)
				if (cases[i].checked)
                                                   {
				platsFavoris.push(cases[i].value);
			             var lesPlats+=(cases[i].value) + "<br />" ;
}
 
 
 
			return alert(lesPlats);
 
		}

19/09/2013, 09h21
Bovino

JavaScript n'est pas Python et il faut utiliser des accolades pour regrouper les instructions d'une structure (boucle, condition, etc.), la seule indentation ne suffit pas !
19/09/2013, 09h24
eliottgiraudo

suite
oui pardon c'est rectifié je m'en suis rendu compte juste apres mais ça ne fonctionne pas quand même.
Il ya a une erreur de logique dans le code ? Je comprends pas

(mains il me dis qu'il attend un point virgule sur la ligne ) =>

Code:

var lesPlats+=(cases[i].value) + "<br />" ;

Dans le html sur la ligne qui lance la fonction :
Code:

1 2 SCRIPT5007: La valeur de la propriété « afficherMessage » est null ou non définie, pas un objet Function testJSChap2 - Copie.html, Ligne 46 Caractère 42
19/09/2013, 14h18
SylvainPV

Le navigateur te dit qu'il ne trouve pas la fonction afficherMessage. Autrement dit que le code de la fonction n'a pas été interprété au moment où tu veux l'utiliser. Il nous faudrait donc le reste du code pour savoir d'où vient le problème.
19/09/2013, 14h27
Bovino

En même temps, dans le code que tu as modifié (message #7), ouvrir une accolade, c'est un bon début, mais il faut aussi la fermer...

suite

Bonjour,

Voici le code entier corrigé qui ne fonctionne pas :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 
	<head>
 
		<title>Mes tests ! </title>
  		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  		<!-- en-tete du document -->
 
 
 
 
		<script type="text/javascript">
 
 
 
		function afficherMessage()
		{
			var cases = document.getElementById("idForm").mesCases;
			var platsFavoris=new Array();
 
			for (var i=0; i<cases.length;i++)
				if (cases[i].checked)
				{
					var lesPlats+=(cases[i].value) + "<br />" ;
				}
 
 
 
			return alert(lesPlats);
 
		}
 
		</script>	
 
 
	</head>
 
	<body>  <!-- corps du document -->
 
	<form id="idForm">
	Vous aimez : <br />
<input type="checkbox" name="mesCases" value="pizza" />la pizza <br />   
<input type="checkbox" name="mesCases" value="tartiflette" /> la tartiflette <br />
<input type="checkbox" name="mesCases" value="ratatouille" /> la ratatouille <br />   
<input type="button" value="Ok" onclick="afficherMessage()" /> 
</form>
 
	</body>
 
</html>

20/09/2013, 15h01
Bovino

C'est sûr que si tu ne connais pas le B.A.BA, tu ne risques pas d'aller très loin...
Le mot clé var sert à définir une variable, si tu l'utilises dans une boucle, chaque itération va redéfinir la variable et écraser la précédente valeur...
20/09/2013, 15h05
eliottgiraudo

suite

Je suis les tutoriels de débutant, je trouve pas de niveau plus "bas".

Pourquoi m'avoir fait poirotter si vous saviez la réponse ? :(

Dans le 1er message ce code y est.

MERCI quand même.
20/09/2013, 15h10
Bovino

Citation:

Dans le 1er message ce code y est.

Ainsi que les nombreuses autres erreurs qu'on t'a indiquées précédemment... :roll:

suite

Ok ok.
Maintenant il m'affiche "undefined" suivis des noms de cases cochés, suivis de <br>. Les balises ne sont pas traduites et en 1er il y a tout le temps undefined. ( Que j'écrive <br> ou <br /> cela ne change rien)

Mais pas d'erreurs de détecté

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 
	<head>
 
		<title>Mes tests ! </title>
  		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  		<!-- en-tete du document -->
 
 
 
 
		<script type="text/javascript">
 
 
 
		function afficherMessage()
		{
			var cases = document.getElementById("idForm").mesCases;
			var lesPlats;
 
			for (var i=0; i<cases.length;i++)
				if (cases[i].checked)
					lesPlats+=cases[i].value + '<br>';
 
 
 
 
			return alert(lesPlats);
 
		}
 
		</script>	
 
 
	</head>
 
	<body>  <!-- corps du document -->
 
	<form id="idForm">
	Vous aimez : <br />
<input type="checkbox" name="mesCases" value="pizza" />la pizza <br />   
<input type="checkbox" name="mesCases" value="tartiflette" /> la tartiflette <br />
<input type="checkbox" name="mesCases" value="ratatouille" /> la ratatouille <br />   
<input type="button" value="Ok" onclick="afficherMessage()" /> 
</form>
 
	</body>
 
</html>

20/09/2013, 17h45
SylvainPV

alert n'est pas prévu pour afficher du HTML, simplement afficher une phrase. C'est donc parfaitement normal s'il n'est pas interprété.
Quant à undefined, c'est la valeur initiale de ta variable, vu que tu ne lui en donnes pas. Attribue-là plutôt à une String vide au début.

Code:

var lesPlats ="";
20/09/2013, 18h35
NoSmoking
Citation:

Je suis les tutoriels de débutant,...

donc si tu es débutant il te faut prendre tout de suite de bonnes habitudes et notamment
- déclarer TOUTES tes variables en début de fonction avec le mot clé var.
- Initialiser toutes les variables qui feront l'objet d'un affectation/ajout du type +=, tu as là un exemple du plantage/arrachage de cheveux.
- utiliser SYSTEMATIQUEMENT les {instructions} dans les instructions if, for, while ou autre do.

il y en a bien d'autres, tu en découvriras certaines de toi même.

Pour en revenir à ton utilisation de return alert(lesPlats), même si cela t'affiche quelque chose, en retour de fonction tu auras undefined.
Code:

1 2 3 4 5 6 7 function fct(){ var result = 'valeur retournée'; return alert( result); } var test = fct(); alert( 'fct=' +test); // fct()=undefined
24/09/2013, 16h50
eliottgiraudo

suite

Pk il est vide ? je ne comprends pas désolé pour moi doit s'afficher la string contenue....
25/09/2013, 18h18
NoSmoking
la méthode alert() affiche bien le texte passé en paramètre mais cette méthode retourne une valeur, comme toutes les fonctions, dans le cas d'alert la valeur retournée est undefined, comme toutes les fonctions qui ne retournent rien.
Dans certains langages de telles fonctions s’appellent des procédures.

Le fait de faire alert( result) fait que la fonction fct() retourne le résultat renvoyé par l'alert soit...undefined.

Si tu veux exploiter le résultat d'une fonction, ce qui est la moindre des choses il te faut retourné directement le résultat.
Code:

1 2 3 4 5 6 function fct(){ var result = 'valeur retournée'; return result; } var test = fct(); alert( 'fct=' +test); // fct()=valeur retournée
Voilà pour faire simple...
27/09/2013, 12h16
eliottgiraudo

RESOLU

Ok je ne sais pas qu'un alert renvoyé obligatoirement undefined !! Je vois comment faire maintenant ! MERCI !