首页 > 代码库 > easyui 中的treegrid添加checkbox
easyui 中的treegrid添加checkbox
<script type="text/javascript">function show(checkid){ var s = ‘#check_‘+checkid; //alert( $(s).attr("id")); // alert($(s)[0].checked); /*选子节点*/ var nodes = $("#test").treegrid("getChildren",checkid); for(i=0;i<nodes.length;i++){ $((‘#check_‘+nodes[i].id))[0].checked = $(s)[0].checked; } //选上级节点 if(!$(s)[0].checked){ var parent = $("#test").treegrid("getParent",checkid); $((‘#check_‘+parent.id))[0].checked = false; while(parent){ parent = $("#test").treegrid("getParent",parent.id); $((‘#check_‘+parent.id))[0].checked = false; } }else{ var parent = $("#test").treegrid("getParent",checkid); var flag= true; var sons = parent.sondata.split(‘,‘); for(j=0;j<sons.length;j++){ if(!$((‘#check_‘+sons[j]))[0].checked){ flag = false; break; } } if(flag) $((‘#check_‘+parent.id))[0].checked = true; while(flag){ parent = $("#test").treegrid("getParent",parent.id); if(parent){ sons = parent.sondata.split(‘,‘); for(j=0;j<sons.length;j++){ if(!$((‘#check_‘+sons[j]))[0].checked){ flag = false; break; } } } if(flag) $((‘#check_‘+parent.id))[0].checked = true; } } } function formatcheckbox(val,row){ return "<input type=‘checkbox‘ onclick=show(‘"+row.id+"‘) id=‘check_"+row.id+"‘ "+(row.checked?‘checked‘:‘‘)+"/>" + row.name; } function init(){ //去掉结点前面的文件及文件夹小图标 $(".tree-icon,.tree-file").removeClass("tree-icon tree-file"); $(".tree-icon,.tree-folder").removeClass("tree-icon tree-folder tree-folder-open tree-folder-closed"); } //获取选中的结点function getSelected(){ var idList = ""; $("input:checked").each(function(){ var id = $(this).attr("id"); if(id.indexOf(‘check_type‘)== -1 && id.indexOf("check_")>-1) idList += id.replace("check_",‘‘)+‘,‘; }) alert(idList);} </script></head> <body onl oad="init()"> <input type="button" value="http://www.mamicode.com/showselectNode" onclick="getSelected();"> <table id="test" title="Folder Browser" class="easyui-treegrid" style="width:400px;height:300px" url="treegrid_data.json" rownumbers="true" idField="id" treeField="name"> <thead> <tr> <th field="name" width="160" formatter="formatcheckbox">Name</th> <th field="size" width="60" align="right">Size</th> <th field="date" width="100">Modified Date</th> </tr> </thead> </table> </body></html>
[{ "id":"type_1", "name":"C", "size":"", "date":"02/19/2010", "sondata":"type_2,type_3", "children":[{ "id":"type_2", "name":"Program Files", "size":"120 MB", "date":"03/20/2010", "checked":true, "sondata":"21,22", "children":[{ "id":21, "name":"Java", "size":"", "date":"01/13/2010", "state":"closed", "sondata":"211,212", "children":[{ "id":211, "name":"java.exe", "size":"142 KB", "date":"01/13/2010", "sondata":"" },{ "id":212, "name":"jawt.dll", "size":"5 KB", "date":"01/13/2010", "sondata":"" }] },{ "id":22, "name":"MySQL", "size":"", "date":"01/13/2010", "state":"closed", "sondata":"221,222,223", "children":[{ "id":221, "name":"my.ini", "size":"10 KB", "date":"02/26/2009", "sondata":"" },{ "id":222, "name":"my-huge.ini", "size":"5 KB", "date":"02/26/2009", "sondata":"" },{ "id":223, "name":"my-large.ini", "size":"5 KB", "date":"02/26/2009", "sondata":"" }] }] },{ "id":"type_3", "name":"eclipse", "size":"", "date":"01/20/2010", "sondata":"31,32,33", "children":[{ "id":31, "name":"eclipse.exe", "size":"56 KB", "date":"05/19/2009", "sondata":"" },{ "id":32, "name":"eclipse.ini", "size":"1 KB", "date":"04/20/2010", "sondata":"" },{ "id":33, "name":"notice.html", "size":"7 KB", "date":"03/17/2005", "sondata":"" }] }]}]
easyui 中的treegrid添加checkbox
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。