zoukankan      html  css  js  c++  java
  • EXTJS4扩展实例:如何使用filter查询treepanel


    我们在使用普通的store时,extjs提供了filterBy,filter等多种方法来过滤数据达到查询效果,但在treepanel中的streeStore却没有实现这个查询,于是,就有了这篇文章。

    首先定义一个类'MyExtend.lib.TreeFilter'

    Ext.define('MyExtend.lib.TreeFilter', {
    	filterByText: function(text) {
    		this.filterBy(text, 'text');
    	},
    	/**
    	 * 根据字符串过滤所有的节点,将不符合条件的节点进行隐藏.
    	 * @param 查询字符串.
    	 * @param 要查询的列.
    	 */
    	filterBy: function(text, by) {
    
    		this.clearFilter();
    
    		var view = this.getView(),
    			me = this,
    			nodesAndParents = [];
    
    		// 找到匹配的节点并展开.
    		// 添加匹配的节点和他们的父节点到nodesAndParents数组.
    		this.getRootNode().cascadeBy(function(tree, view) {
    			var currNode = this;
    
    			if (currNode && currNode.data[by] && currNode.data[by].toString().toLowerCase().indexOf(text.toLowerCase()) > -1) {
    				me.expandPath(currNode.getPath());
    
    				while (currNode.parentNode) {
    					nodesAndParents.push(currNode.id);
    					currNode = currNode.parentNode;
    				}
    			}
    		}, null, [me, view]);
    
    		// 将不在nodesAndParents数组中的节点隐藏
    		this.getRootNode().cascadeBy(function(tree, view) {
    			var uiNode = view.getNodeByRecord(this);
    
    			if (uiNode && !Ext.Array.contains(nodesAndParents, this.id)) {
    				Ext.get(uiNode).setDisplayed('none');
    			}
    		}, null, [me, view]);
    	},
    
    
    	clearFilter: function() {
    		var view = this.getView();
    
    		this.getRootNode().cascadeBy(function(tree, view) {
    			var uiNode = view.getNodeByRecord(this);
    
    			if (uiNode) {
    				Ext.get(uiNode).setDisplayed('table-row');
    			}
    		}, null, [this, view]);
    	}
    });
    

      接下来定义一个你自己的treepanel,并混入这个类

    Ext.define('MyTreePanel',{
    	extend:'Ext.tree.Panel',
    	mixins:['MyExtend.lib.TreeFilter']
    	
    });
    

      

    后面的代码我就省略了,用你定义的MyTreePanel来生成一个treepanel,然后使用
    treepanel.filterByText('xxx') 或treepanel.filterBy('xxx','列名') 进行过滤查询

  • 相关阅读:
    谷歌(google)广告尺寸大小列表
    D盘Program Files 文件夹里文件不显示,没隐藏。怎么才能显示出来?
    请问IOS中做一个手机网站的app壳复杂吗?
    zblog2.X 连不上数据库原因
    二叉查找树的实现与讲解(C++)
    记一次应用异常,处理过程
    C# RSA加密
    js对象 c#对象转换
    C# 微信消息模板 发送
    iis 虚拟目录 文件服务器
  • 原文地址:https://www.cnblogs.com/zdkjob/p/3593515.html
Copyright © 2011-2022 走看看