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 }