JQuery EasyUI之treegrid级联勾选的简单改进版

最近需要搞点权限方面的东西,后台用的是Jquery Easyui treegrid 1.2.6,可惜没有级联勾选功能

Tree如下格式

0

----1

--------2

--------3

----4

--------5

--------6

--------7

根节点是0,级别是0,有两个子节点1,4,级别为1,

子节点1,4各自有多节点分别是2,3和5,6,7,级别为2

需求如下

1.选择根节点0的时候,必须选择所有后代节点,1-7全部都要被选择

2.取消选择根节点0的时候,必须取消选择所有后代节点,1-7全部都要被取消选择

3.当选择节点1的时候,必须将1的父节点0也选择,但此时0的其它子节点就不能自动被选择了,保持原样

4.取消1节点的时候,同2步,后代节点2,3都取消

5.当选择2节点的时候,需要选择1,0两个节点,

6.取消2的时候,需要看3是否有没有被选择,如果有则1选择,如果3没选,则1不选,0是否被选需要看1或者4有没有被选择

总结一下

1.选择某节点的时候,必须选择这个节点下面的所有后代节点,反之,取消选择后代子节点

2.选择某节点的时候,必须将此节点的父节点选上,包含所有前代父节点

取消某节点的时候,如果此节点的兄弟节点都没有被选择,那么父节点,也取消选择,

换句话说就是需要看父节点下面的子节点有没有被选择的,有那么父节点仍然选择,如果没有一个被选择,那么父节点也取消选择

-------------找前人的劳动成功

搜索到一篇文章,感谢原作者

treegrid级联勾选或深度级联勾选扩展：两种扩展

里面有两种方式实现了上述需求的的1,实现2中的一部分,

不过在取消节点时候,父节点是否取消有点问题

我主要是用第二种方式(属性方式,非函数方式),这里我加上了一个函数 判断父节点是否需要被取消

 1 /** 
 2  * 级联判断父节点 的子节点是否有被选择的
 3  * @param {Object} target 
 4  * @param {Object} id 节点ID 
 5  * @return {TypeName}  
 6  */  
 7 function IsParentHasSelectedChildren(target,id,idField,status)
 8 {
 9     var count=0;
10     var children = target.treegrid('getChildren',id);    
11     var selectNodes = $(target).treegrid('getSelections');//获取当前选中项     
12     var p=target.treegrid('find',id);  
13     //注意,这里的children是指后代所有子节点,不是指儿子节点,所以要加上children[i]['_parentId']==p[idField]过滤出儿子节点
14     for(var i=0;i<children.length ;i++  )
15     {
16         var childId = children[i][idField];  
17         for(var j=0;j<selectNodes.length;j++){  
18             if(selectNodes[j][idField]==childId && children[i]['_parentId']==p[idField])  
19                 count++;
20         }
21     }
22     //注意,click 函数在unselect事件之前运行,这里需要减去自己
23     return count-1>0;
24 }

主要是增加函数IsParentHasSelectedChildren,父节点下面的儿子节点被选择的个数是否大于0来判断是否取消父节点

里面最后count减一,是当前click事件是在onselect事件有关,表示排除自己,这里没有详细研究,

在函数selectParent的里面加上第九行调用的

 1 function selectParent(target,id,idField,status){  
 2     var parent = target.treegrid('getParent',id);  
 3     if(parent){  
 4         var parentId = parent[idField];  
 5         if(status)  
 6             target.treegrid('select',parentId);  
 7         else  
 8         {
 9             if (!IsParentHasSelectedChildren(target,parentId,idField))
10                 target.treegrid('unselect',parentId);  
11         }
12         selectParent(target,parentId,idField,status);  
13     }  
14 }