JQ Tree Показать только выбранные узлы с родительским нажатием кнопки - PullRequest
0 голосов
/ 10 ноября 2018

Я должен показывать только выбранные узлы и родительские узлы и скрывать остальные узлы при нажатии кнопки. Когда я нажимаю кнопку, ничего не происходит.

jsfiddle

http://jsfiddle.net/375emow0/

код с комментированием начать по нажатию кнопки
$ ('button [name = "psychTree-selected"]'). click (функция (узел) {

get the selected nodes
nodesSelected = $('#psychTree').tree('getSelectedNodes');

create an array for shown nodes
nodeIdsToStay = [];

walk through selected nodes
nodesSelected.forEach( function(node) {
var path = $('#psychTree').tree('getData');
path.forEach(function(n) {
if (nodeIdsToStay.indexOf(n)===-1) {
nodeIdsToStay.push(n);
}
})
})

hide the nodes not in the array
$('#psychTree').find('li').each( function(){
if ( nodeIdsToStay.indexOf(this.id) === -1 ) {
$(this).hide();
}
})
})

Я знаю, как скрыть выбранные узлы, но, по-видимому, у невыбранных узлов нет идентифицируемого класса для поиска и скрытия с помощью http://jsfiddle.net/tom1nkfr/

`$('button[name="psychTree-selected"]').click( function() {`
`$('#psychTree').find('.jqtree-selected').each( function(){`
`$(this).hide();`
`})`
`})`

1 Ответ

0 голосов
/ 11 ноября 2018

Я бы порекомендовал более простой подход - похоже, что вы пытаетесь найти все выбранные узлы, помещаете их в array, затем выполняете итерацию по всему jsTree и скрываете все узлы не в array, который вы создали. Вместо этого используйте CSS-классы, которые jsTree уже применяет к выбранным узлам, и просто скройте все те, у которых его нет.

Упрощенный JS:

$('button[name="psychTree-selected"]').click(function() {
  $('#psychTree li.jqtree_common').each(function(index,elem){
    if(!$(elem).hasClass('jqtree-folder') && !$(elem).hasClass('jqtree-selected')){
        $(elem).hide();
    }
  });
})

По-прежнему срабатывает при нажатии кнопки, но теперь он перебирает все узлы дерева и скрывает все, которые (1) не выбраны и (2) не являются родительскими / папочными узлами.

Рабочая JSFiddle: http://jsfiddle.net/tbwjau5m/

...