为jQuery EasyUI tree增加搜索功能(二)

来源:互联网 发布:深圳佳为软件 编辑:程序博客网 时间:2024/05/16 00:41

效果如下:
这里写图片描述

实现代码如下:

/** * 树形菜单搜索方法 *  * @author bin.zhang */function searchTree(treeObj, parentNode, searchCon) {    $(treeObj).tree('collapseAll'); //折叠所有    var children;    for (var i = 0; i < parentNode.length; i++) { //循环顶级 node        children = $(treeObj).tree('getChildren', parentNode[i].target); //获取顶级node下所有子节点        if (children) { //如果有子节点            for (var j = 0; j < children.length; j++) { //循环所有子节点                if ($(treeObj).tree('isLeaf', children[j].target)) { //判断子级是否为叶子节点,即不是父节点                    if (children[j].text.indexOf(searchCon) >= 0) { //判断节点text是否包含搜索文本                                            selectNode(treeObj, children[j]); //设置此节点为选择状态                        expandParent(treeObj, children[j]); //设置此节点所有父级展开                        break;                    }                }            }        } else {            if (parentNode[i].text.indexOf(searchCon) >= 0) {                selectNode(treeObj, parentNode[i]);                expandParent(treeObj, parentNode[i]);                break;            }        }    }}/** * 标记为选择状态 *  * @author bin.zhang */function selectNode(treeObj, node) {    $(treeObj).tree('select', node.target);}/** * 展开所有父级节点 *  * @author bin.zhang */function expandParent(treeObj, node) {    var parent = node;    var t = true;    do {        parent = $(treeObj).tree('getParent', parent.target); //获取此节点父节点        if (parent) { //如果存在            t = true;            $(treeObj).tree('expand', parent.target);        } else {            t = false;        }    } while (t);}/** * 调用搜索方法 *  * @author bin.zhang */function sysTextSearch(inputID, treeID) {    var search_content = $('#' + inputID).val(); //得到搜索的文件    if (search_content == '') {        $('#' + treeID).tree('expandAll'); //展开所有    } else {        var roots = $('#' + treeID).tree('getRoots'); //得到tree顶级node        searchTree($('#' + treeID), roots, search_content);    }}

使用如下:

/** * @author bin.zhang *  * 根据输入框中的关键字,搜索对应的接口并展开 */function searchAndSpread(that) {    var curTreeId = getCurrentTreeId()//目录树的id    var keyInputId = curTreeId.replace("tree", "keyword")//搜索框的id    sysTextSearch(keyInputId,curTreeId);}
1 0
原创粉丝点击