如果搜索字符串没有匹配任何节点，则显示所有节点

jstree showing all nodes if search string didn't match any node

本文关键字：节点 显示 任何 搜索 字符串 如果      更新时间：2023-09-26

我正在用以下配置渲染jtree 

$('#deliverables').jstree({
    'core': {
        'data': data
    },
    'search': {
        'case_insensitive': true,
        'show_only_matches' : true
    },
    'plugins': ['search']
});
$('#deliverable_search').keyup(function(){
    $('#deliverables').jstree('search', $(this).val());
});

使用此配置，jtree仅在搜索文本找到至少一个节点时显示匹配的节点。但是，如果搜索文本与任何节点不匹配，jtree将显示所有节点。我觉得这有点奇怪。我错过什么了吗?

https://jsfiddle.net/t9fe58rt/1/链接供参考

这是一个预期的行为，参见:https://github.com/vakata/jstree/issues/1192#issuecomment-128042329

但是您可以将处理程序附加到search事件，如果结果为空，则相应地进行操作，例如。您可以使用hide_all方法隐藏所有树节点。

代码:

.on('search.jstree', function (nodes, str, res) {
    if (str.nodes.length===0) {
        $('#deliverables').jstree(true).hide_all();
    }
})

但是不要忘记在触发新的搜索之前显示它们:

$('#deliverable_search').keyup(function(){
    $('#deliverables').jstree(true).show_all();
    $('#deliverables').jstree('search', $(this).val());
});

演示:https://jsfiddle.net/xfn8aa19/

对于我来说，Irvin Dominin的答案是不够的

 $('#deliverable_search').keyup(function () {
        $('#deliverables').jstree(true).show_all();
        $('.jstree-node').show();
        $('#deliverables').jstree('search', $(this).val());
        $('.jstree-hidden').hide();
        $('a.jstree-search').parent('li').find('.jstree-hidden').show();
    });
相关文章：