2016-02-19 16 views
5

mam to JsTreeJsTree wyboru - sprawdź wydarzenie

enter image description here

z tym kodem:

var Tree = $("#MyTree"); 

     Tree.jstree({ 
      "core": { 
       "themes": { 
        "responsive": false, 
        "multiple" : false, 
       }, 
       "data": dataTree 
      }, 
      "types": { 
       "default": { 
        "icon": "icon-lg" 
       }, 
       "file": { 
        "icon": "icon-lg" 
       } 
      }, 
      "ui": { 
       "select_limit": 1, 
      }, 
      "plugins": ["wholerow", "types", "checkbox", "ui", "crrm", "sort"], 
      "checkbox": { 
       "three_state": false, 
       "real_checkboxes": false 
      } 
     }); 

muszę oddzielić wybór i działanie wyboru, użytkownik musi sprawdzić wszystkie węzeł on chce, ale wybierz tylko jeden wiersz na czas. na teraz, gdy klikam wszędzie w wierszu, wybierz ten wiersz i sprawdź ten węzeł, muszę zaznaczyć pole wyboru tylko wtedy, gdy użytkownik go kliknie.

staram tyle imprezę, ale tylko, że praca jest:

Tree.on("changed.jstree", function (e, data) { }); 

że złapać zarówno działanie doboru i sprawdzenia.

Wszelkie sugestie?

Odpowiedz

13

Ta odpowiedź dotyczy wydania 3 jstree - tego powinieneś użyć w roku 2016. Niestety, twój przykładowy kod wydaje się być przy użyciu jstree rel 1 i nie mogę ci w tym pomóc.

Dla uwolnienia 3

Przede wszystkim rozwiązać wybrany i sprawdzonych Zjednoczone (checkbox.tie_selection: false) - Zobacz the docs

Następnie użyć zdarzenia check_node.jstree

robocza przykład

var data1 = [{ 
 
     "id": "W", 
 
     "text": "World", 
 
     "state": { "opened": true }, 
 
     "children": [{"text": "Asia"}, 
 
        {"text": "Africa"}, 
 
        {"text": "Europe", 
 
        "state": { "opened": false }, 
 
        "children": [ "France","Germany","UK" ] 
 
     }] 
 
    }]; 
 

 
$('#Tree').jstree({ 
 
    core: { 
 
     data: data1, 
 
     check_callback: false 
 
    }, 
 
    checkbox: {  
 
     three_state : false, // to avoid that fact that checking a node also check others 
 
     whole_node : false, // to avoid checking the box just clicking the node 
 
     tie_selection : false // for checking without selecting and selecting without checking 
 
    }, 
 
    plugins: ['checkbox'] 
 
}) 
 
.on("check_node.jstree uncheck_node.jstree", function(e, data) { 
 
    alert(data.node.id + ' ' + data.node.text + 
 
     (data.node.state.checked ? ' CHECKED': ' NOT CHECKED')) 
 
})
<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" type="text/css" rel="stylesheet" /> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script> 
 
    <div id="Tree"></div>

+0

@LorenzoGrossi dodałem sprawnego snippet – edc65

+0

Pobrałem jstree 3.2.1, urywek jest dokładnie to, co mam do zrobienia, ale to nie działa w moim roztwór ... w moim rozwiązaniu nie robi 't dodaj zaznaczenie po kliknięciu w pole, ale dodaj je, gdy wybiorę wiersz –

+0

@LorenzoGrossi przejrzeć parametry tworzenia. Szczególnie sekcja "checkbox". – edc65

Powiązane problemy