(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. 创建一个web Test Plan

    1.添加ThreadGroup (1).线程组界面解析: 线程数:虚拟用户的个数 Ramp-up Period:开启每个用户的延迟时间,如果有5个虚拟用户,Ramp-up Period值是5,Jmet ...

  2. linux第6天 流协议-粘包

    今天学习的主要是对第5天的加强. 比如服务器的多进程,点对点应用聊天程序.父进程子进程互发消息.等等. 流协议-粘包 一般TCP协议会出现粘包,粘包产生的原因一般为.TCP协议是流式传输,不会根据用户 ...

  3. JSP动作跳转页面的时候与根目录的问题

    在JSP动作:<jsp:forward page="....">中,这个page属性所指定的页面要包含根目录的话,必须要用"/",不能够用" ...

  4. it精英的艰辛路程

    我出生在呼和浩特市,但我并不是蒙古族人,而是彻彻底底的汉族人.我父亲小时候因为家里穷,十八九岁就独自出来闯荡了,后来在呼和浩特市发展的不错,还遇到了我妈,就定居下来了,结婚两年后就有了我. 小时候的家 ...

  5. drds 分库表的创建速记

    关键词 :dbpartition by hash(`INVESTOR_APPLY_ID`) 格式 :dbpartition by hash(分库字段) 创建例子: CREATE TABLE `BB_J ...

  6. iBatis面试题

    1) Ibatis中使用like ‘%#filedName#%’ 时,有什么问题? 在xml映射文件中,如果直接按如上写法,会报异常:java.sql.SQLException: Invalid ar ...

  7. UIViewController卸载过程(ios6.0以后)

    在ios6.0以后,废除了viewWillUnload方法和viewDidUnload方法. 在ios6以后,当收到didReceiveMemoryWarning消息调用之后,程序会自动调用didRe ...

  8. Oracle 10g dataguard broker 配置

    环境: OS:rhel6.3_64bit DB:Oracle10gR2 ————————————————————————dataguard broker配置—————————————————————— ...

  9. 使用git和github托管个人项目

    1.  安装 cygwin 和 cygwin 下的 git , 测试 git 命令可用;   参考: https://cygwin.com/install.html 2.  注册 github 账号: ...

  10. Apache服务器访问过慢分析及解决

    起因:线上的一台服务器,最近总是出现 访问 很慢的情况发生,点击一个链接要2秒钟以上才能打开,按照我们对于访问人数的估计,服务器应该不至于响应这么慢,从而需要针对这个问题进行分析,来解决网站访问过慢. ...