JQuery Dynatree - 如何使用级别分隔符搜索节点？

Question

我需要为我的 dynatree 使用搜索功能，所以我找到了这个解决方法：JQuery Dynatree - search node by name

但是，我只需要让它搜索到我的扩展节点分隔符。 （我正在使用 jQuery ui-slider 来动态设置扩展分隔符）。 最初，我需要它搜索直到我的 minExpandedLevel。如果我移动滑块，dynatree 应该仅显示匹配结果，展开级别相当于滑块值。

尝试重置 minExpandLevel 并重新加载 dynatree 是行不通的，因为它会返回所有（甚至不匹配的）节点作为结果。

所以我想在搜索功能中添加一个限制参数，例如：

$(selector).dynatree("getRoot").search(pattern, limit);

有人知道怎么做吗？

这是我的代码：

动力树：

$.ui.dynatree.nodedatadefaults["icon"] = false;

$("#resultTree").dynatree({
    minExpandLevel: 4,
    persist: false,
    classNames: {
        vline: "no-bg",
        connector: "",
        expander: "ui-helper-hidden"
    },
    children: myJsonData
});

滑块：

timeout = false;
searchTerm = $("#searchText").val();
$("#treeslider").slider({
    min: minTick,
    max: maxTick,
    range: "min",
    slide: function (event, ui) {
        if (timeout) {
            clearTimeout(timeout);
        }
        timeout = setTimeout(function () {
            $("#resultTree").dynatree("getRoot").search(searchTerm, ui.value);
        }, 500);

    }
});

Answer 1

这是一段从根开始并访问每个节点但不处理级别 3 或更低级别的节点的代码：

$("#tree").dynatree("getRoot").visit(function(node){

    if( node.getLevel() > 2) {
        return 'skip';
    }

    console.log('processing node "' + node.data.title + '" at level ' + node.getLevel());

});

如果返回字符串'skip'，访问函数将停止处理分支。

Answer 2

好的，我想我找到了答案：

我修改了_searchNode 函数，因此它会隐藏大于级别分隔符的匹配节点，但只要术语在其子项中匹配就会显示父节点（甚至不匹配）。

var clear = true;
DynaTreeNode.prototype.search = function (pattern,limit) {
if (typeof limit == "undefined") {
    limit = 0;
}

if (pattern.length < 1 && !clear) {
    clear = true;
    this.visit(function (node) {
        node.expand(true);
        node.li.hidden = false;
        node.expand(false);
    });
} else if (pattern.length >= 1) {
    clear = false;
    this.visit(function (node) {
        node.expand(true);
        node.li.hidden = false;
    });
    var searchDepth = 1;
    for (var i = 0; i < this.childList.length; i++) {
        var hide = { hide: false };
        this.childList[i]._searchNode(pattern, hide, searchDepth, limit);
    }
}
},

// bottom-up node searching function
DynaTreeNode.prototype._searchNode = function (pattern, hide, searchDepth, limit) {
    var level = searchDepth;
    if (this.childList) {
        // parent node
        var hideNode = true;
        var searchDepth = level+1;
        for (var i = 0; i < this.childList.length; i++) {
            var hideChild = { hide: false };
            this.childList[i]._searchNode(pattern, hideChild, searchDepth, limit);
            hideNode = hideNode && hideChild.hide;
        }

        if (hideNode && !this._isRightWithPattern(pattern)) {
            this._hideNode();
            hide.hide = true;
        } else {
            if (limit && level > limit) {
                this._hideNode();
            }
            hide.hide = false;
        }

    } else {
        // leaf        
        if (!this._isRightWithPattern(pattern)) {
            this._hideNode();
            hide.hide = true;
        } else {
            if (limit && level > limit) {
                this._hideNode();
            }
            hide.hide = false;
        }
    }
}