11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je viens d'écrire mon premier script en javascript et je souhaiterais avoir votre avis et vos conseils d'optimisation.

Objectif :
Sur une page, je vais avoir un certains nombres de checkbox créées dynamiquement regroupées par thème.
Je souhaiterais qu'à chaque click, en haut de page la liste des checkbox sélectionnées apparaissent.


<html>
<head>
<title></title>
<script language="javascript">
function verifchk(){
var m = 0;
var selection;
selection = "Case sélectionnée : ";
	for (i=1;i<9;i++){
		if (eval("document.forms.formulaire.chk"+i+".checked == true")){
		m = m + 1;
		selection = selection + eval("document.forms.formulaire.chk"+i+".value")+ ", " ;
		}
	}
	if (m == 0){
		alert("Aucune case cochée");
	}
	else
	{
		alert("Vous avez coché " + m + " cases");
		alert(selection);
	}
}
</script> </head>
<body>
<form name="formulaire" method="POST">
<div id="case1">
<input type="checkbox" name="chk1" value="1er choix" OnClick="verifchk();" />1er choix
<input type="checkbox" name="chk2" value="2eme choix" OnClick="verifchk();" />2eme choix
<input type="checkbox" name="chk3" value="3eme choix" OnClick="verifchk();" />3eme choix
<input type="checkbox" name="chk4" value="4eme choix" OnClick="verifchk();" />4eme choix<BR>
</div>
<div id="case2">
<input type="checkbox" name="chk5" value="5eme choix" OnClick="verifchk();" />5eme choix
<input type="checkbox" name="chk6" value="6eme choix" OnClick="verifchk();" />6eme choix
<input type="checkbox" name="chk7" value="7eme choix" OnClick="verifchk();" />7eme choix
<input type="checkbox" name="chk8" value="8eme choix" OnClick="verifchk();" />8eme choix<BR>
</div>
</form>
</body>
</html>


Comment faire apparaitre la liste autrement que par une alerte ?
Modifié par Babali (09 Feb 2009 - 17:16)
Babali a écrit :
Comment faire apparaitre la liste autrement que par une alerte ?


Bonjour,

1° solution : Tu disposes dans le html d'un objet identifié (genre div par exemple), tu remplis par JS sa propriété innerHTML après avoir obtenu son identifiant au moyen de la fonction getElementById
2° solution : Tu crées cet élément d'accueil dans ton JS avec les fonctions createElement - createTextNode - et tu le greffes sur l'arbre du DOM avec appendChild;

Voilà pour un raccourci. Documentes-toi sur les fonctions / propriétés que je t'ai citées et reviens le cas échéant préciser plus l'objet de ta demande.
Modifié par aCOSwt (09 Feb 2009 - 13:03)