Bonjour,

J'aimerais à partir d'un script JS automatisé la selection de plusieur input de type checkbox en un click sur un autre input de type checkbox. Pour ce faire j'ai créé une fonction JS qui s'active au click du input. Le script marche bien mais la partie HTML ne donne pas le rendu attendu.

CI-après les différents script. Merci d'avance pour votre aide.

<table>
							<caption>Days :</caption>
							<tbody>
								<tr>
									<td>
										<input type="checkbox" id="days" name="days" onclick="check_all_day();"/>
										Check all
									</td>
								</tr>
								<tr>
									<td><input type="checkbox" name="jours[]" value="Monday"/> Monday | </td>
									<td><input type="checkbox" name="jours[]" value="Tuesday"/> Tuesday | </td>
									<td><input type="checkbox" name="jours[]" value="Wednesday"/> Wednesday | </td>
									<td><input type="checkbox" name="jours[]" value="Thuersday"/> Thuersday | </td>
									<td><input type="checkbox" name="jours[]" value="Friday"/> Friday | </td>
									<td><input type="checkbox" name="jours[]" value="Saturday"/> Saturday | </td>
									<td><input type="checkbox" name="jours[]" value="Sunday"/> Sunday </td>
								</tr>
							</tbody>
						</table>

function check_all_day()
{
	//recuperons l'id du champs a cocher
	days = document.getElementById('days');
	//recuperation des jours
	jours = document.getElementsByName('jours[]');
	for(i=0; i <= jours.length; i++)
	{
		jours[i].setAttribute("checked","checked");
	}
}

 PS : le <br> ne fait pas partie du script.

-
Edité par ShadowWorker 28 septembre 2016 à 19:10:23

Bonjour,

voici quelques problèmes que j'ai trouvé dans ton code :

• Tout d'abord, dans ton javascript, récupérer l'id du champs à cocher ne sert, a rien, tu peux donc enlever les lignes 3 et 4
• Ton "onclick" n'appelle pas la fonction check_all_day car elle est défini défini plus bas dans le code que la ligne ou tu défini ton "onclick" => du coup ton javascript ne trouve pas la fonction check_all_day (tu peux détecter l'erreur en faisant clic droit => Inspecter => Console)
• Ensuite, petite erreur de logique => ton setAttribute("checked","checked") ne permet pas de décocher les cases si l'utilisateur décoche la case "check all"

Voici donc ce que je te propose pour remplacer ton javascript : 

function check_all_day()
{
    //recuperation des jours
    jours = document.getElementsByName('jours[]');
    for(i=0; i <= jours.length; i++)
    {
       jours[i].click();
    }
}

document.getElementById('days').addEventListener("click", check_all_day);

La ligne 7 permet de générer un event de click automatiquement sur tous les "jours".

La ligne 11 permet de lancer la fonction "check_all_day" si elle détecte un clic sur l'element avec l'id "days".

Ouah merci bien le code marche et j'ai remarqué que, lorsque j'appel le script apres le code HTML ça ne marche pas. 

Je conclus donc qu'il faut appeler le script JS avant l'HTML. ;-) (Même si tu l'as déjà dis dans ton msg)

Quiz : A quel moment est-il conseillé insérer le script JS après le code HTML ?.

Mais il y a un autre soucis. Je testais mon application que sous firefox developpeur et internet exploreur mais je viens à peine de me rendre compte d'aucun script ne s'exécute javascript ne s'exécute sous google chrome.

-
Edité par ShadowWorker 29 septembre 2016 à 17:45:38

Avec addEventListener, il n'y a pas besoin d'appeller le script après le code normalement

Pour le fait que ça ne s’exécute pas sous chrome : regarde ta console du navigateur pour voir si il y a des erreurs (si tu ne sais pas comment les résoudre, poste ici).

Si il n'y a pas d'erreur, poste nous ton code en entier, qu'on voit un peu la bête

Voici le code javascript qui me permet d'afficher mes différents formulaires.

function open_form()
{
	nbr = form.formulaire_name.length;
	//alert(nbr);
	var i = 0;
	var myArray = ['cacher', 'rate', 'souscription', 'bonus', 'souscriber_p'];
	for(i = 0; i <= nbr; i++)
	{
		document.getElementById(myArray[i]).style.display="none";
		if(form.formulaire_name.options[i].selected)
		{
			option_value = form.formulaire_name.options[i].value;
			document.getElementById(option_value).style.display="block";
		}
	}
}

Merci, voici les erreurs que ma console affiche. Pour les erreur 404 il n'y a pas de soucis. Quant aux autres erreurs 

-
Edité par ShadowWorker 4 octobre 2016 à 5:36:47