Checkbox Onclick et load de Jquery
Résolu
regitraz
Messages postés
89
Date d'inscription
Statut
Membre
Dernière intervention
-
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
J'essaye de faire en sorte que sur cochage / décochage d'une checkbox je puisse via la fonction onclick inclure un de mes graphique dans une div avec un ID dédié a ce graphique.
J'utilise jquery 3.3.1 et sa fonction load pour essayer de faire ca.
J'ai donc ma checkbox :
Les variables du code suivant ne servent qu'a définir le chemin correct pour inclure le fichier associé a ma checkbox (de la forme "modele/2_cluster/Plot1K2.html") et l'ID. Je ne souhaite pas modifier ce mode de fonctionnement.
Les graphes sont dans un fichier HTML contenant du js qui les génères.
Ma tentative de fonction js :
Et pour finir ma div qui attend d'être remplie avec le graphique :
Et ce qu'il se passe c'est que mon graphique ne s'affiche pas, je ne comprend pas pourquoi c'est pour ca que je demande ici ^^
Si possible j'aimerai ne pas utiliser ca $("Sankey").click(function(placeToLoad) car il fautdrait que je fasse 6 copier coller pour chaque ID de chaque checkBox.
La partie cacher / unload le graphe sera gérée quand cette partie fonctionnera.
Merci d'avance !
J'essaye de faire en sorte que sur cochage / décochage d'une checkbox je puisse via la fonction onclick inclure un de mes graphique dans une div avec un ID dédié a ce graphique.
J'utilise jquery 3.3.1 et sa fonction load pour essayer de faire ca.
J'ai donc ma checkbox :
<label class="noselect" for="Sankey"> <input onclick="loadCluster(this.id)" type="checkbox" class="mr-1" id="Sankey">Sankey </label>
Les variables du code suivant ne servent qu'a définir le chemin correct pour inclure le fichier associé a ma checkbox (de la forme "modele/2_cluster/Plot1K2.html") et l'ID. Je ne souhaite pas modifier ce mode de fonctionnement.
Les graphes sont dans un fichier HTML contenant du js qui les génères.
Ma tentative de fonction js :
$(document).ready(function(){ $("Sankey").click(function(placeToLoad){ var clusterFile = '<?=$_POST['nbCluster']?>'; var nbCluster = clusterFile.slice(7, 8); var elem = "/"+placeToLoad+"K"+nbCluster+".html"; clusterFile = clusterFile + elem; placeToLoad = "#"+placeToLoad+"d"; console.log(placeToLoad); $(placeToLoad).load(clusterFile); }); });
Et pour finir ma div qui attend d'être remplie avec le graphique :
<div class="row m-3"> <div class="col-md-6 col-12" id="Sankeyd"></div> </div>
Et ce qu'il se passe c'est que mon graphique ne s'affiche pas, je ne comprend pas pourquoi c'est pour ca que je demande ici ^^
Si possible j'aimerai ne pas utiliser ca $("Sankey").click(function(placeToLoad) car il fautdrait que je fasse 6 copier coller pour chaque ID de chaque checkBox.
La partie cacher / unload le graphe sera gérée quand cette partie fonctionnera.
Merci d'avance !
A voir également:
- Checkbox Onclick et load de Jquery
- Load optimized defaults - Forum Windows
- Bios asus/exit/load optimized defaults - Forum BIOS
- Pc ne demarre plus après avoir rétablit paramètres par défaut ✓ - Forum Windows 7
- Load optimized defaults traduction - Forum Matériel & Système
- Acrobat failed to load its core dll ✓ - Forum Windows
3 réponses
Bonjour,
Première chose .. si ça ne marche pas il faudrait regarder dans la console js du navigateur si il n'y aurait pas des messages d'erreur.
Ensuite, (ou en même temps...) il faudrait ajouter des console.log des variables dans le code histoire de voir si leur contenu est bon
=> au moins celle la :
A noter que tu as mis du PHP dans ton JS ... hummm ... es-tu certains de récupérer la variable $_POST['nbCluster']
Et pour fini :
Alors non ...
Dans l'idéal, tu mets une CLASS "fictive" à tes input et ainsi tu peux les cibler tous avec une seule fonction en javascript
Par exemple
et en js
Première chose .. si ça ne marche pas il faudrait regarder dans la console js du navigateur si il n'y aurait pas des messages d'erreur.
Ensuite, (ou en même temps...) il faudrait ajouter des console.log des variables dans le code histoire de voir si leur contenu est bon
=> au moins celle la :
console.log("clusterFile", clusterFile );
A noter que tu as mis du PHP dans ton JS ... hummm ... es-tu certains de récupérer la variable $_POST['nbCluster']
Et pour fini :
Si possible j'aimerai ne pas passer par la ligne $("Sankey").click(function(placeToLoad) car il faut drait que je fasse 6 copier coller pour chaque ID différents.
Alors non ...
Dans l'idéal, tu mets une CLASS "fictive" à tes input et ainsi tu peux les cibler tous avec une seule fonction en javascript
Par exemple
<label class="noselect" for="Sankey"> <input type="checkbox" class="mr-1 choix" id="Sankey">Sankey </label> <label class="noselect" for="Autre"> <input type="checkbox" class="mr-1 choix" id="Autre">Autre </label>
et en js
$(".choix").click(function(){ var id = $(this).id; // récupère l'id du checkbox cliqué //... la suite de ton code //... // ... });
J'ai fait quelques modification pour adapter mon code, j'ai donc ajouter une classe CSS check a toutes mes checkbox, enlever le onclick et modifier ma fonction comme suit :
Voici ce qui s'affiche dans la console sur click de la checkbox :
le chemin est correct, c'est la partie récupération de l'ID qui ne fonctionne pas.
Essaye avec :
et montre nous le code html de tes inputs. ( le code généré.. c'est à dire, lorsque tu affiches la page dans ton navigateur, tu fais CTRL+u pour en afficher la source.. et tu nous le colles ici )
Et le message d'erreur qui est apparut dans la console :
Bokey c'est la bibliothèque python que l'on a utiliser pour générer ce graphe interactif html, losrqu'on inclut manuellement en PHP il n'y a aucun soucis
Donc le souci ne vient pas du code que tu nous as montré...