(function ($) {
//combotree可编辑,自定义模糊查询
$.fn.combotree.defaults.editable = true;
$.extend($.fn.combotree.defaults.keyHandler, {
query: function (q) {
var t = $(this).combotree('tree');
t.tree("search", q);
}
});
$.extend($.fn.tree.methods, {           
/**   
         * 扩展easyui tree的搜索方法 
         * @param tree easyui tree的根DOM节点(UL节点)的jQuery对象          
* @param searchText 检索的文本 
         * @param this-context easyui tree的tree对象          */
search: function (jqTree, searchText) {
//easyui tree的tree对象。可以通过tree.methodName(jqTree)方式调用easyui tree的方法 
var tree = this;
//获取所有的树节点 
var nodeList = getAllNodes(jqTree, tree);
//如果没有搜索条件,则展示所有树节点       
searchText = $.trim(searchText);
if (searchText == "") {
for (var i = 0; i < nodeList.length; i++) {
$(".tree-node-targeted",
nodeList[i].target).removeClass("tree-node-targeted");
$(nodeList[i].target).show();
}
//展开已选择的节点(如果之前选择了)            
var selectedNode = tree.getSelected(jqTree);
if (selectedNode) {
tree.expandTo(jqTree, selectedNode.target);
}
return;
}
//搜索匹配的节点并高亮显示            
var matchedNodeList = [];
if (nodeList && nodeList.length > 0) {
var node = null;
for (var i = 0; i < nodeList.length; i++) {
node = nodeList[i];
if (isMatch(searchText, node.text)) {
matchedNodeList.push(node);
}
}
//隐藏所有节点 
for (var i = 0; i < nodeList.length; i++) {
$(".tree-node-targeted", nodeList[i].target).removeClass("tree-node-targeted");
$(nodeList[i].target).hide();
}
//折叠所有节点 
tree.collapseAll(jqTree);
//展示所有匹配的节点以及父节点

for (var i = 0; i < matchedNodeList.length; i++) {
showMatchedNode(jqTree, tree, matchedNodeList[i]);
}
}
},
/**   
* 展示节点的子节点(子节点有可能在搜索的过程中被隐藏了)        
* @param node easyui tree节点         
*/
showChildren: function (jqTree, node) {
//easyui tree的tree对象。可以通过tree.methodName(jqTree)方式调用easyui tree的方法 
var tree = this;
//展示子节点 
if (!tree.isLeaf(jqTree, node.target)) {
var children = tree.getChildren(jqTree, node.target);
if (children && children.length > 0) {
for (var i = 0; i < children.length; i++) {
if ($(children[i].target).is(":hidden")) {
$(children[i].target).show();
}
}
}
}
},
/**   
* 将滚动条滚动到指定的节点位置,使该节点可见(如果有滚动条才滚动,没有滚动条就不滚动) 
* @param param {   
* treeContainer: easyui tree的容器(即存在滚动条的树容器)。如果为null,则取easyui tree的根UL节点的父节点。 
* argetNode:  将要滚动到的easyui tree节点。如果targetNode为空,则默认滚动到当前已选中的节点,如果没有选中的节点,则不滚动          * }             */
scrollTo: function (jqTree, param) {
//easyui tree的tree对象。可以通过tree.methodName(jqTree)方式调用easyui tree的方法 
var tree = this;
//如果node为空,则获取当前选中的node   
var targetNode = param && param.targetNode ? param.targetNode : tree.getSelected(jqTree);
if (targetNode != null) {
//判断节点是否在可视区域                 var root = tree.getRoot(jqTree);   
var $targetNode = $(targetNode.target);
var container = param && param.treeContainer ? param.treeContainer : jqTree.parent();
var containerH = container.height();
var nodeOffsetHeight = $targetNode.offset().top - container.offset().top;
if (nodeOffsetHeight > (containerH - 30)) {
var scrollHeight = container.scrollTop() + nodeOffsetHeight - containerH + 30;
container.scrollTop(scrollHeight);
}
}
}
});
/**   
     * 展示搜索匹配的节点      */
function showMatchedNode(jqTree, tree, node) {
//展示所有父节点 
$(node.target).show();
$(".tree-title", node.target).addClass("tree-node-targeted");
var pNode = node;
while ((pNode = tree.getParent(jqTree, pNode.target))) {
$(pNode.target).show();
}
//展开到该节点 
tree.expandTo(jqTree, node.target);
//如果是非叶子节点,需折叠该节点的所有子节点      
if (!tree.isLeaf(jqTree, node.target)) {
tree.collapse(jqTree, node.target);
}
}
/**   
     * 判断searchText是否与targetText匹配 
     * @param searchText 检索的文本      * @param targetText 目标文本 
     * @return true-检索的文本与目标文本匹配;否则为false.        
*/
function isMatch(searchText, targetText) {
return $.trim(targetText) != "" && targetText.indexOf(searchText) != -1;
}
/**   
     * 获取easyui tree的所有node节点      */
function getAllNodes(jqTree, tree) {
var allNodeList = jqTree.data("allNodeList");
if (!allNodeList) {
var roots = tree.getRoots(jqTree);
allNodeList = getChildNodeList(jqTree, tree, roots);
jqTree.data("allNodeList", allNodeList);
}
return allNodeList;
}
/**   
     * 定义获取easyui tree的子节点的递归算法      */
function getChildNodeList(jqTree, tree, nodes) {
var childNodeList = [];
if (nodes && nodes.length > 0) {
var node = null;
for (var i = 0; i < nodes.length; i++) {
node = nodes[i];
childNodeList.push(node);
if (!tree.isLeaf(jqTree, node.target)) {
var children = tree.getChildren(jqTree, node.target);
childNodeList = childNodeList.concat(getChildNodeList(jqTree, tree, children));
}
}
}
return childNodeList;
}
})(jQuery);

easyui.combotree.search.js的更多相关文章

  1. easyui combotree 异步树 前端写法js

    简要说下使用场景: combotree下拉框第一次加载时,请求一个接口,页面上展示顶层节点们(可以理解为最顶层的节点,比如所有的一级公司): 当点击其中一个节点前面的小三角展开时,再次请求服务器接口( ...

  2. easyui Combotree 怎么加载数据 支持多选

    1.开发环境vs2012 mvc4  c# 2.HTML前端代码 <%@ Page Language="C#" AutoEventWireup="true" ...

  3. EasyUI ComboTree无限层级异步加载示例

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EasuUIDemoTree.a ...

  4. 表单(上)EasyUI Form 表单、EasyUI Validatebox 验证框、EasyUI Combobox 组合框、EasyUI Combo 组合、EasyUI Combotree 组合树

    EasyUI Form 表单 通过 $.fn.form.defaults 重写默认的 defaults. 表单(form)提供多种方法来执行带有表单字段的动作,比如 ajax 提交.加载.清除,等等. ...

  5. Jquery Easyui验证扩展,Easyui验证,Easyui校验,js正则表达式

    Jquery Easyui验证扩展,Easyui验证,Easyui校验,js正则表达式 >>>>>>>>>>>>>> ...

  6. EasyUI 如何结合JS导出Excel文件

    出处:http://blog.csdn.net/jumtre/article/details/41119991 EasyUI 如何结合JS导出Excel文件 分类: 技术 Javascript jQu ...

  7. Jquery EasyUI Combotree和 EasyUI tree展开所有父节点和获取完整路径

    Jquery EasyUI Combotree展开所有父节点 Jquery EasyUI Combotree获取树完整路径 Jquery EasyUI tree展开所有父节点 Jquery EasyU ...

  8. Jquery EasyUI Combotree根据选中的值展开所有父节点

    Jquery EasyUI Combotree根据选中的值展开所有父节点  Jquery EasyUI Combotree 展开父节点, Jquery EasyUI Combotree根据子节点选中的 ...

  9. Jquery EasyUI Combotree 初始化赋值

    Jquery EasyUI Combotree 初始化赋值 ================================ ©Copyright 蕃薯耀 2018年5月7日 https://www. ...

随机推荐

  1. acm pc^2的配置与使用

    -------------------------------------------------------------------------------------- !!! 转载请注明: 转自 ...

  2. "数学口袋精灵"bug的发现及单元测试

    1.项目内容: 团队项目:二次开发 至此,我们有了初步的与人合作经验,接下来投入到更大的团队中去. 也具备了一定的个人能力,能将自己的代码进行测试.接下来尝试在别人已有的基础上进行开发. 上一界51冯 ...

  3. Linux MD5值递归比对目录中的文件是否有修改

    项目上今天遇到检查两个版本的发布包rc1.tar.gz和rc2.tar.gz的一致性,解决方法做个总结,步骤如下 1. 建立文件夹 mkdir test_rc1 test_rc2 2. 文件解压缩 t ...

  4. 在EditText前面添加一个搜索的小图片

    1,这是EditText中的一个小的属性 代码: android:drawableLeft="@drawable/searchico" 效果图如下:

  5. 夺命雷公狗---DEDECMS----28dedecms浏览次数的完成

    在页面里显示每部影视作品的浏览量,显示方法如下所示: 首先我们要在内容模板文件里增加显示区: 然后到后保存下文章页的内容页的模版,然后去看下对我们的样式有没有什么影响: 看到这里我们就已经成功一点点噢 ...

  6. JSP-06-使用JDBC操作数据库

    6.1 使用JDBC查询数据 [链接oracle数据库] 具体操作: 1)  将odbc文件拷贝到项目中 Odbc文件所在目录: oracle安装目录下- product – db_1 – jdbc  ...

  7. yii2语言设置

    1.父配置文件在yii2/base/Application中的$language="en-US", 修改项目的语言可以修改项目的配置文件main.php中加'language'=& ...

  8. HTML5游戏引擎Phaser初体验

    首发:个人博客,更新&纠错&回复 一个小小的游戏在这里,试试看能不能过关?提示一下,方向键走路,空格键发炮,每发炮弹消耗12个积分,变大情况下可以发炮. 每秒60次的循环重绘,在其中判 ...

  9. LoadRunner11下载以及详细破解说明【最新】

    Loadrunner11破解所需两个dll文件以及自动删除注册表工具,使用方法见附件readme.也可安装网上的办法,手动删除注册表项. 下载破解文件lm70.dll和mlr5lprg.dll lm7 ...

  10. gerrit docker运行失败 chown: /var/gerrit/review_site: Permission denied 【已解决】

    Docker Volume 之权限管理(转) - jackluo - 博客园 http://www.cnblogs.com/jackluo/p/5783116.html 为什么在公司电脑没有问题,但在 ...