Extjs4增加Tree节点级选方法，可异步级选

        树的刷新常常是整颗树全部节点刷新，但有些时候我们需要只刷新某一个节点下的数据，方法很简单，在异步树中我们不难发现，第一次展开一个节点的时候是向后台获取数据的，第二次展开就不会再获取，因方法如下处理：

Ext.applyIf(Ext.data.Model.prototype,{ /* * 重载 */reload:function(){var me=this;    me.set('loaded', false);me.set('expanded',false);me.expand();},/* * 添加新节点时重载 */loadNewNode:function(){var me=this;me.set("leaf",false);me.reload();}});

     树的级选是很常见的操作，笔者整理后添加了异步树的级选操作，就是先展开节点再级选，代码如下：

/* * 级选 */cascadeCheck:function(checked){var me=this;me.childCheck(checked);me.parentCheck(checked);},/* * 级选并展开子节点 */cascadeCheckExpand:function(checked){var me=this;me.childCheckExpand(checked);me.parentCheck(checked);},/* * 级选子节点 */childCheck:function(checked){var me=this;me.cascadeBy(function(child) {child.set('checked', checked);   });},/* * 级选子节点并展开 */childCheckExpand:function(checked){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];child.set('checked', checked);child.childCheckExpand(checked);}}});},/* * 级选父节点 */parentCheck:function(checked){var me=this;var parentNode = me.parentNode;if (parentNode != null) {if((checked&&!parentNode.get('checked'))||(!checked&&!parentNode.hasCheckedChild())){        parentNode.set('checked', checked);parentNode.parentCheck(checked);}}   },/*     * 是否存在已选择子节点     */   hasCheckedChild:function(){          var node = this;          var value=false;        node.eachChild(function(child) {            if (child.get('checked')) {                value=true;                return false;            }        });        return value;   }

      此代码跟上面的放在一起即可，加到节点方法上。

      还有一种情况可能大家都有经历，就是级选被包含的节点，比如商品类别，每个商家拥有一套完整的商品类别，这个时候当我第二次修改商家的商品类别时，系统肯定要先把已经保存到该商家的节点勾选出来，这里有两个要求，一是勾选出已经存储的节点，二是树不能全部展开，可以想像，总的商品类别树是很庞大的，不可能把全部节点展开再级选包含的节点，所以改造如下：

/* * 级选并展开被包含节点 */containCheckChildExpand:function(cons,id){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];     if (cons.contain(child.get(id))) {child.set('checked', true);child.containCheckChildExpand(cons,id);}else if(child.get('checked')){child.set('checked', false);child.childCheck(false);}}}});},/* * 级选被包含节点并展开全部 */containCheckChildAllExpand:function(cons,id){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];     if (cons.contain(child.get(id))) {child.set('checked', true);}else if(child.get('checked')){child.set('checked', false);child.childCheck(false);}child.containCheckChildAllExpand(cons,id);}}});},/* * 级选被包含节点（同步树） */containCheckChild:function(cons,id){var me=this;me.cascadeBy(function(child) {if (cons.contain(child.get(id))) {child.set('checked', true);}else{child.set('checked', false);}   });},   /* * 级选被包含子节点 */   selectContainChildren:function(res,id){   var cons = new Array();Ext.each(res, function(re) {cons.push(eval("re." + id));});this.containCheckChildExpand(cons,id);   },   /* * 级选被包含子节点并展开全部 */    selectContainChilds:function(res,id){   var cons = new Array();Ext.each(res, function(re) {cons.push(eval("re." + id));});this.containCheckChildAllExpand(cons,id);   }

     参数说明一下，cons是包含的数据数组，id是树节点中用于判断是否包含的属性，res是包含的json数组，比如包含数据是：["12","25"]，id是text，那么判断是方法 就是node.text是否包含在这个数组中，如果是json数组，就先转换为一般数组，再判断。

     使用的效果是只展开并且勾选了被包含的节点，不包含的节点将不会展开，当然代码中提供了全部展开且勾选被包含节点的方法，   

     完整代码如下：

/** * 树节点方法 */Ext.applyIf(Ext.data.Model.prototype,{ /* * 重载 */reload:function(){var me=this;    me.set('loaded', false);me.set('expanded',false);me.expand();},/* * 添加新节点时重载 */loadNewNode:function(){var me=this;me.set("leaf",false);me.reload();},/* * 级选（同步树） */cascadeCheck:function(checked){var me=this;me.childCheck(checked);me.parentCheck(checked);},/* * 级选并展开子节点 */cascadeCheckExpand:function(checked){var me=this;me.childCheckExpand(checked);me.parentCheck(checked);},/* * 级选子节点 */childCheck:function(checked){var me=this;me.cascadeBy(function(child) {child.set('checked', checked);   });},/* * 级选父节点 */parentCheck:function(checked){var me=this;var parentNode = me.parentNode;if (parentNode != null) {if((checked&&!parentNode.get('checked'))||(!checked&&!parentNode.hasCheckedChild())){        parentNode.set('checked', checked);parentNode.parentCheck(checked);}}   },   /* * 是否存在已选择子节点 */   hasCheckedChild:function(){      var node = this;      var value=false;node.eachChild(function(child) {if (child.get('checked')) {value=true;return false;}});return value;   },/* * 级选子节点并展开 */childCheckExpand:function(checked){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];child.set('checked', checked);child.childCheckExpand(checked);}}});},/* * 级选并展开被包含节点 */containCheckChildExpand:function(cons,id){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];     if (cons.contain(child.get(id))) {child.set('checked', true);child.containCheckChildExpand(cons,id);}else if(child.get('checked')){child.set('checked', false);child.childCheck(false);}}}});},/* * 级选被包含节点并展开全部 */containCheckChildAllExpand:function(cons,id){var me=this;me.expand(false,function(childs){    if(childs!=null){    for(var i=0;i<childs.length;i++){     var child=childs[i];     if (cons.contain(child.get(id))) {child.set('checked', true);}else if(child.get('checked')){child.set('checked', false);child.childCheck(false);}child.containCheckChildAllExpand(cons,id);}}});},/* * 级选被包含节点(同步树) */containCheckChild:function(cons,id){var me=this;me.cascadeBy(function(child) {if (cons.contain(child.get(id))) {child.set('checked', true);}else{child.set('checked', false);}   });},   /* * 级选被包含子节点 */   selectContainChildren:function(res,id){   var cons = new Array();Ext.each(res, function(re) {cons.push(eval("re." + id));});this.containCheckChildExpand(cons,id);   },   /* * 级选被包含子节点并展开全部 */    selectContainChilds:function(res,id){   var cons = new Array();Ext.each(res, function(re) {cons.push(eval("re." + id));});this.containCheckChildAllExpand(cons,id);   }});

作者：kunoy

出处：http://blog.csdn.net/kunoy

申明：作者写博是为了总结经验，和交流学习之用。
如需转载，请尽量保留此申明，并在文章页面明显位置给出原文连接。谢谢！