(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. MYSQL数据库自动本地/异地双备份/MYSQL增量备份

    构建高安全电子商务网站之(网站文件及数据库自动本地/异地双备份)架构图 继续介绍Linux服务器文件备份,数据库备份,数据安全存储相关的电子商务系统架构.针对安全性有多种多样的解决方案,其中数据备份是 ...

  2. 1. 星际争霸之php面向对象(一)

    题记==============================================================================本php设计模式专辑来源于博客(jymo ...

  3. [php] 判断当前运行模式

    //判断是否cgi模式 define('IS_CGI',substr(PHP_SAPI, 0,3)=='cgi' ? 1 : 0 ); //判断操作系统是否为windows define('IS_WI ...

  4. SqlServer 中如何查看某一个Sql语句是复用了执行计划,还是重新生成了执行计划

    我们知道SqlServer的查询优化器会将所执行的Sql语句的执行计划作缓存,如果后续查询可以复用缓存中的执行计划,那么SqlServer就会为后续查询复用执行计划而不是重新生成一个新的执行计划,因为 ...

  5. Spark实战2:Zeppelin的安装和SparkSQL使用总结

    zeppelin是spark的web版本notebook编辑器,相当于ipython的notebook编辑器. 一Zeppelin安装 (前提是spark已经安装好) 1 下载https://zepp ...

  6. UIViewController启动过程

    流程:判断是否view属性为nil,如果为空,调用loadView方法,如果重写了loadView方法,那么从代码创建普通视图,如果没有重写并且有storyBoard或者xib文件,那么从storyB ...

  7. 【转】Delphi利用系统环境变量获取常用系统目录

    Delphi code //譬如 %WINDIR% 是表示系统目录的系统变量, 可以这样获取: var s: string; begin s := GetEnvironmentVariable('WI ...

  8. 图像处理控件ImageGear for .NET教程如何为应用程序 添加DICOM功能(2)

    在前面的一些关于图像处理控件ImageGear for .NET文章<图像处理控件ImageGear for .NET教程: 添加DICOM功能(1)>中讲解了如何对应用程序添加DICOM ...

  9. sql多表查询(out join,inner join, left join, right join)

    left join以左表为基准显示所有左表的信息,在on中有符合条件的其他表也显示出来 right join则相反 inner join的只显示on中符合条件的 1 使用多个表格 在「world」资料 ...

  10. 鸟哥的linux私房菜之档案与文件系统的压缩与打包

    00000001 节约空间 其实简单的说压缩就是把没有用到的0给去掉,解压的时候在加上 在linux中,压缩文件档案的扩展名大多是.tar,.tar.gz,tgz,gz,.Z,.bz2 compres ...