ext的tree的filter即搜索功能,按照ext的API写有一个bug,当节点下有二级子节点的时候,filter其它节点,不论此节点是否满足filter条件,都会出现,搞了半天才将这个bug解决掉,现在记下来,以备以后用到。
原代码:
hiddenPkgs = [];
tree.root.cascade(function(n) {
if(!n.isLeaf()&& n.ui.ctNode.offsetHeight<3){
n.ui.hide();
hiddenPkgs.push(n);
}
});
bug主要出在这段控制隐藏的代码上,其中关键是n.ui.ctNode.offsetHeight<3,当节点有子节点的时候,他的n.ui.ctNode.offsetHeight就会大于3,所以会显示。修改这个bug,只需要修改这段代码即可。在源过滤条件后面加个条件,修改后的代码如下:
修改一:只支持对叶子的搜索,不支持对枝干的搜索
hiddenPkgs = [];
tree.root.cascade(function(n) {
if(!n.isLeaf()&& n.ui.ctNode.offsetHeight<3&& !re.test(n.text)){
n.ui.hide();
hiddenPkgs.push(n);
}
if(n.id!='root'){
if(!n.isLeaf() && n.ui.ctNode.offsetHeight >= 3 && hasChild(n,re)==false&& !re.test(n.text)){
n.ui.hide();
hiddenPkgs.push(n);
}
}
});
function hasChild(n,re){
var str=false;
n.cascade(function(n1){
if(n1.isLeaf() && re.test(n1.text)){
str = true;
return;
}
});
return str;
}
}
修改二:支持对叶子、枝干的搜索。
var hiddenPkgs = [];
var filter = new Ext.tree.TreeFilter(tree, {
clearBlank: true,
autoClear: true
});
function filterTree(){
var text = members_name.getValue();
Ext.each(hiddenPkgs, function(n){
n.ui.show();
});
if(!text){
filter.clear();
return;
}
tree.expandAll();
var re = new RegExp(Ext.escapeRe(text), 'i');
filter.filterBy(function(n){
var textval = n.text;
return !n.isLeaf() || re.test(n.text);
});
// hide empty packages that weren't filtered
hiddenPkgs = [];
tree.root.cascade(function(n) {
if(!n.isLeaf()&& n.ui.ctNode.offsetHeight<3&& !re.test(n.text)){
n.ui.hide();
hiddenPkgs.push(n);
}
if(n.id!='root'){
if(!n.isLeaf() && n.ui.ctNode.offsetHeight >= 3 && hasChild(n,re)==false&& !re.test(n.text)){
n.ui.hide();
hiddenPkgs.push(n);
}
}
});
function hasChild(n,re){
var str=false;
n.cascade(function(n1){
if(re.test(n1.text)){
str = true;
return;
}
});
return str;
}
}
修改二与修改一是有区别的,并且修改二不能取代修改一,因为,修改一也有应用点,如:如果只让用户对叶子进行搜索那么应该是当搜索枝干时应该没有结果,若用修改二则不很好,用修改一更合理
分享到:
相关推荐
[Ext 3.x + Ext 2.x] 下拉树 Ext.ux.ComboBoxTree
EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档EXT.JS_文档...
1. Ext.form.NumberField 2. Ext.form.TextArea 3. Ext.form.TriggerField 4. Ext.form.DateField 5. Ext.form.ComboBox 6. Ext.form.TimeField
Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文Ext.3.0.中文
Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI最新中文文档Ext2.xAPI...
ext3.x 支持全选半选的树ext3.x 支持全选半选的树ext3.x 支持全选半选的树ext3.x 支持全选半选的树ext3.x 支持全选半选的树ext3.x 支持全选半选的树
org.restlet.ext.spring.jar
wsl2生成的vhdx 后缀的虚拟磁盘文件特点是可以自动扩容,但是一般不会自动缩容,这个脚本可以压缩vhdx文件,如果vhdx路径不知道可以参考:https://blog.csdn.net/wl6g11/article/details/131831524 ...
单片机第六次实验外部中断EXT1、EXT2.docx单片机第六次实验外部中断EXT1、EXT2.docx单片机第六次实验外部中断EXT1、EXT2.docx单片机第六次实验外部中断EXT1、EXT2.docx单片机第六次实验外部中断EXT1、EXT2.docx...
单片机第六次实验外部中断EXT1、EXT2.pdf单片机第六次实验外部中断EXT1、EXT2.pdf单片机第六次实验外部中断EXT1、EXT2.pdf单片机第六次实验外部中断EXT1、EXT2.pdf单片机第六次实验外部中断EXT1、EXT2.pdf单片机第六...
extjs 可编辑的表格树,每个单元格自定义编辑组件,可以自适应列宽,只有源码与例子,运行实例要修改路径,不然图片不能显示,注意etree.jsp的js引入路径 支持Ext2.x以上版本 如运行不了EmailTo : codeme9@gmail....
extjs多选下拉框,Ext.ux.form.LovCombo,extjs 以修复多选下拉框火狐下取不到值的问题,火狐下div不显示背景色的问题
Ext.NET.MVC.Pro.2.2.0.zip 官网下载的
Ext.NET.MVC.Pro.2.2.0.MVC.Examples.Explorer 包含了所有你需要的控件DEMO。
新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf新版ext教程.pdf
Ext.NET.WebForms.Pro.5.2.0 使用时注意事项: 该版本为5.2.0,若之前系统是用的非5.X版本时,切勿随意升级到该版本! 新建项目可以使用该版本。 以上版本仅供学习使用,不做任何商业用途!!!!
Ext3.x样式 Ext3.x皮肤 收集整理了21套Ext3.x的样式皮肤文件 如果各位嫌Ext样式单一的话绝对可以解决你的需求 让你眼前一亮
基于java的开发源码-Lerx开源网站内容管理系统(CMS.ext).zip 基于java的开发源码-Lerx开源网站内容管理系统(CMS.ext).zip 基于java的开发源码-Lerx开源网站内容管理系统(CMS.ext).zip 基于java的开发源码-Lerx开源...
Ext.NET.WebForms.Pro.2.5.2 官网http://examples2.ext.net/
Ext.data.Store的基本用法 Ext.data.Store的基本用法 Ext.data.Store的基本用法