jsTree Case Masquer

Je suis en utilisant le jsTree plugin jQuery pour afficher un 5 niveaux de profondeur de l'arbre. Je voudrais ne pas afficher les cases à cocher sur le dernier niveau. Est-il possible de le faire que dans le cadre ou certains jquery traitement je peux faire par la suite pour enlever ces cases? Je suis en mesure de les désactiver en utilisant les types de plugin, mais j'ai vraiment envie de ne pas être visible.

Voici un exmple de mon arbre "[x]" = une case à cocher

[x] lvl 1
  [x] lvl 2
    [x] lvl 3
      [x] lvl 4
        [x] lvl 5a
        [x] lvl 5b
        [x] lvl 5c

Voici un exmple de ce que je veux "[x]" = une case à cocher

[x] lvl 1
  [x] lvl 2
    [x] lvl 3
      [x] lvl 4
          lvl 5a
          lvl 5b
          lvl 5c

MODIFIER LA RÉPONSE QUE L'ON TROUVE

Trouvé la réponse. Ajouter la .lier qui sera appelée lorsque l'arbre est chargé puis certains jquery simple à masquer la case à cocher.

$("#right-tree2").bind("loaded.jstree", function(event, data) {
   $('.lvl4').find('ins.jstree-checkbox').hide();
})
.jstree({....});
Vous devez vérifier pour le dernier chemin dans votre arbre. Le dernier élément n'a ni frère suivant, ni les enfants. Si oui, vous lisez le nœud parent et de supprimer ou de masquer les enfants des cases à cocher. Je pense que vous devriez externalisé ce code dans une fonction supplémentaire et de l'appeler après que l'arbre a été généré. Je sais que ce n'est pas très efficace, mais d'une façon qui peut fonctionner.
Ok, j'ai été en mesure de supprimer les nœuds, mais avec un petit problème. Si je l'appelle, $('.lvl4').find('ins.jstree-case").hide(); sur un clic sur un bouton, il fonctionne, mais pas juste après les .jstree appel. Est-il possible d'exécuter une commande après que l'arbre est fait de rendu?
Je ne sais pas votre code source,donc je ne peux pas dire si c'est possible.

OriginalL'auteur jbrook10 | 2011-05-24

  1. 18

    Si vous êtes à la création de l'arbre de JSON, puis j'ai trouvé le moyen le plus facile pour enlever les nœuds à l'aide de css.

    1. Dans le JSON, définir la a_attr champ de nœuds que vous voulez être désactivé pour "no_checkbox" comme ci-dessous. Cela va ajouter la classe "no_checkbox" à la <a> élément qui contient le nœud de texte, des icônes et des cases à cocher.

      node = {
      text: "foo",
      a_attr: {
      class: "no_checkbox"
      }
      }

    2. Dans le css, créer un sélecteur comme ceci:

      .no_checkbox>i.jstree-checkbox
      {
      display:none
      }

    3. Fait!

    Cela permettra de sélectionner uniquement les cases qui sont directement à l'intérieur de la <a> élément avec la no_checkbox classe, et il va les supprimer à partir de la mise en page. L'avantage de cette méthode sur les autres réponses, c'est que vous pouvez ramener à la case juste en retrait de la classe no_checkbox de la <a> élément. Par exemple, vous pouvez le faire dans le cas des gestionnaires pour les select_node.jstree cas, puis obtenir le nœud DOM qui est passée en argument.

    Bien sûr, si vous êtes à la saisie de données à l'aide de HTML au lieu de JSON, vous pouvez simplement ajouter la classe css dans le code html manuellement ou à l'aide de php/autre langage côté serveur, et il va travailler tout de même.

    OriginalL'auteur Miguel

  2. 2

    Vous pouvez également empêcher la case plugin d'ajouter:

    1. Ajouter une classe à l' <a> balise de tout type de nœud que vous ne voulez pas d'avoir une case à cocher (j'ai utilisé la même que mon rel).

    2. Modifier jquery.jstree.js Case plugin pour ajouter des classes à la .pas (), où les cases sont ajoutés à la DOM. 1.0-rc3, il ressemble à ceci (autour de la ligne 2870):

      $t.children("a" + (_this.data.languages ? "" : ":eq(0)") ).not(":has(.jstree-checkbox) //ADD THE LIST OF CLASSES HERE - BE SURE TO INCLUDE THE DOTS AND SEPARATE WITH COMMAS ").prepend("<\ins class='jstree-checkbox'>&#160;<\/ins>").parent().not(".jstree-checked, .jstree-unchecked").addClass( ts ? "jstree-unchecked" : c );

    De cette façon, vous n'avez pas à ajouter, puis supprimez-les (mauvaises pratiques, si elle peut être évitée).

    OriginalL'auteur SnydeComments

  3. 0

    essayer cela,

    $("#right-tree2").bind("loaded.jstree", function(e, data) {
    var currentNode = data.rslt.obj.attr("id");
    var nodeLevel = data.inst.get_path().length;
    if(nodeLevel == 4){
         $('#'+currentNode).find('> a > .jstree-checkbox').remove();
    }
})

    OriginalL'auteur mathi

  4. 0

    J'ai trouvé une autre solution en utilisant le css. Ce simple code se cache la case à cocher dans la première couche

    .jstree-container-ul>li>a>i.jstree-checkbox
{
    display:none
}

    OriginalL'auteur regufo