ExtJs动态生成含有checkBox的Tree

/*给Tree添加了checkBox选中事件,
选中父接点能自动选中所有子节点,
改变子节点的状态的同时也能根据其兄弟节点的状态来改变父节点的选中状态
。*/
//=========================================代码如下===============
Ext.BLANK_IMAGE_URL = "../../Client/Images/s.gif";
/**
 * @class Ext.tree.CheckboxTree
 * 含有checkbox的树状菜单
 * @param {Object} config中的参数
 * el       必输入
 * dataUrl     必输入
 * rootText    必输入
 * rootId      默认值为0
 */
Ext.tree.CheckboxTree = function(config) {
 var myTreeLoader = new Ext.tree.TreeLoader({
  dataUrl:config.dataUrl
 });
 myTreeLoader.on("beforeload", function(treeLoader, node) {
  treeLoader.baseParams.check = node.attributes.checked;
  treeLoader.baseParams.id = node.id;
 }, this);
 Ext.tree.CheckboxTree.superclass.constructor.call(this, {
  animate:false,
  enableDD:false,
  autoScroll:true,
  useArrows:true,
  containerScroll:true,
  border:false,
  draggable:false,
  dropConfig: {appendOnly:true},
  //el:config.el,
  root:new Ext.tree.AsyncTreeNode({
   text:config.rootText,
   draggable:false,
   checked:config.checked,
   id:'00' || config.rootId
  }),
  loader:myTreeLoader
 });
 var childbool = true;
 new Ext.tree.TreeSorter(this, {folderSort:true});
 this.on({
  'checkchange':function(node, checked) {
   var parentNode = node.parentNode;
   if (checked) {
    /**
     * 节点为真时,此节点的子节点,判断此节点的父节点时,判断父节点的子节点是否全部为
     * 真,如果全部为真,则此父节点为真,如果不为真则不变 全部为真
     */
    if (childbool) {
     var childNodes = node.childNodes;
     for (var i = 0; i < childNodes.length; i++) {
      var childNode = childNodes[i];
      if (!childNode.attributes.checked) {
       childNode.ui.toggleCheck();
      }
     }
    }
    /**
     * 此如果此节点又父节点,则判断此父节点的子节点是否全为真 如果全为真则此父节点也为真
     */
    if (parentNode && !parentNode.attributes.checked) {
     childbool = false;
     parentNode.ui.toggleCheck();
    }
    else  childbool = true;
   } else {
    /**
     * 如果为false时,
     */
    //if(parentNode&&parentNode.attributes.checked){
    //    parentNode.attributes.checked=false;
    //    parentNode.ui.toggleCheck();
    //}
    /*
     *父节点
     */
    ParentState(parentNode);
    /*
     *子接点
     */
    var childNodes = node.childNodes;
    for (var i = 0; i < childNodes.length; i++) {
     var childNode = childNodes[i];
     if (childNode.attributes.checked) {
      childNode.ui.toggleCheck();
     }
    }
   }
  }
 });
}
function ParentState(parentNode) {
 var brothNodes = null;
 if (parentNode != null) //兄弟接点
  brothNodes = parentNode.childNodes;
 else return false;
 var brothflag = 0;
 for (var i = 0; i < brothNodes.length; i++) {
  var brothNode = brothNodes[i];
  if (brothNode.attributes.checked) {
   break;
  }
  else   brothflag++;
 }
 if (brothflag == brothNodes.length) { //说明兄弟节点没选种的
  if (parentNode.attributes.checked)
   parentNode.ui.toggleCheck();
  ParentState(parentNode.parentNode);
 }
}
Ext.extend(Ext.tree.CheckboxTree, Ext.tree.TreePanel, {
 /**
  * 展开根节点
  * @return    返回根节点
  */
 expandRoot:function() {
  this.root.expand(true, false);   //第一个参数表示是否递归展开,第二个属性表示展开是是否有动画效果
  return this.root;
 }
});
var treeLeft = new Ext.tree.CheckboxTree({
 //el:'tree2',
 checked:false,
 dataUrl:'../../tree/RightTree.aspx?admin=true&roleName=' + encodeURIComponent("系统管理员"),
 rootText:'权限菜单',
 rootId:"00"
});


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值