jQuery Girl
  1. jQuery Girl
  3. ajout et suppression d’éléments dans une liste déroulante lors de la sélection et la désactivation des cases à cocher
Intereting Posts
JQuery comment .find () insensible à la casse? Le “bruit de bruit” retentit lorsque l’audio est suspendu avec Javascript MailTo De Javascript Utilisation de Jquery ajax pour appeler la méthode ActionResult dans Controller et renvoyer des données Les boutons next et prev de l’interface utilisateur de JQuery Datepicker n’ont qu’un seul ancêtre. $ (e.target) .parents () ne renvoie qu’un élément Comment supprimer les polylignes de google maps api 3 Un appel Ajax peut-il se terminer avant le chargement du DOM? Pourquoi windows.onload est exécuté plusieurs fois? Obtenir la valeur de liaison de données dans jQuery Ajouter une zone de saisie lors de la sélection d’une option spécifique dans le menu déroulant de sélection AnythingSlider: rendre les tabs de navigation inactifs? Comment supprimer une classe d’erreur à l’aide de jQuery Validate? Comment se débarrasser des requêtes AJAX récursives pour un nœud sans enfant? Obtenir les valeurs d’atsortingbuts de l’option select2 selected jQuery .inArray () toujours vrai?

ajout et suppression d’éléments dans une liste déroulante lors de la sélection et la désactivation des cases à cocher

J’ai 8 cases à cocher actuellement sur une page; chacun représente un nom d’environnement. Je passe le nom de l’environnement dans le code qui consulte ensuite une liste de serveurs et les renseigne dans une liste déroulante avec des en-têtes utilisant optgroup.

Un utilisateur peut cocher une case et un ensemble de noms de serveurs sont ajoutés au menu déroulant. Si, toutefois, ils décochent la même case, tous les serveurs seront à nouveau ajoutés au menu déroulant. Ce que je voudrais, c’est que si un utilisateur décoche une case qu’il a cochée par erreur, je veux que les serveurs associés et la rubrique optgroup soient supprimés de la liste déroulante.

Code jusqu’ici: 

serverList["BERT"] = ["server22", "server1", "server2", "server3"]; serverList["BOB"] = ["server10", "server55", "server99"]; function createServerList(env) { if (env != "") { if (! serverList[env]) { fadeInfoText("ERROR! No Lookup for " + env); return; } $("#ss1").append(""); for (var j = 0; j < serverList[env].length; j ++) { serveritem = serverList[env][j] $("#ss1").find("optgroup").append("" + serveritem + ""); } $("#ss1").multiselect('refresh'); } }

Toute aide serait très appréciée.

Vous êtes sur la bonne voie et le code que vous avez, fonctionne bien pour append les options à la sélection.

Cependant, vous pouvez le simplifier et append un id aux optgroup que vous ajoutez. Cela facilitera ensuite la suppression des options lorsque la case à cocher n’est pas cochée. Il vous suffira ensuite de supprimer le groupe optgroup approprié en fonction de l’ id .

Cet extrait de code vous aidera à comprendre que: 

 var serverList = {}; serverList["BERT"] = ["server22", "server1", "server2", "server3"]; serverList["BOB"] = ["server10", "server55", "server99"]; $("input[type=checkbox]").on("change", function() { refreshList(this.checked, this.value); // bind change event and call your routine }); function refreshList(add, env) { if (! add) { // if checkbox is not checked...remove the optgroup.. $("#ss1").find("optgroup#" + env).remove(); // ..based on id as the checkbox value return; // we don't need to continue } // if checkbox is checked.. var $optgrp = $(""); // ..add an optgroup.. $optgrp.attr("id", env); // ..with id as the checkbox value.. $optgrp.attr("label", env); // .. and whatever label serverList[env].forEach(function(item, idx) { // iterate your serverlist var $opt = $("