在easyui的treeGrid中添加checkbox(jquery)
jsp界面,也可用在aspx、html等前台界面中:
<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 onload="init()">
<input type="button" value="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>
treegrid_data.json代码,仅供参考,可由后端将值以json的方式传递给给前端:
[{
"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(jquery)的更多相关文章
- DataGridView 中添加CheckBox和常用处理方式 .
DataGridView 中添加CheckBox和常用处理方式 文章1 转载:http://blog.csdn.net/pinkey1987/article/details/5267934 DataG ...
- DataGridView中添加CheckBox列用于选择行
DataGridView中添加CheckBox列用于选择行 1,编辑DataGridView,添加一列 CheckBox ,Name 赋值为 "select",如下图: 2,取消 ...
- WPF ListBoxItem模板中添加CheckBox选中问题
原文:WPF ListBoxItem模板中添加CheckBox选中问题 是这样的,需要一个ListBox来展示照片,并添加一个选中的CheckBox.这就需要对ListBox的ItemTemplate ...
- Jquery动态在td中添加checkbox
如图:想要在这个id为headId的<td>中,用jquery动态添加checkbox 代码如下 : data是我用ajax 从后台获取的数据,里面含有若干个user类,我想把所有的人名字 ...
- 2015.12.12 DataGridveiw中添加checkbox列
最简单的办法是通过DataTable来添加 DataTable中添加bool类型的列 dtpdf.Columns.Add("入库", typeof(bool)); DataRow ...
- WinForm:如何在ListBox中添加CheckBox
http://www.cnblogs.com/myshell/archive/2010/09/24/1834184.html 最近因为做WinForm的项目,遇到这个问题,当时以为CheckedLis ...
- easyUI的treegrid列表添加查询
一些数据使用treegrid显示,添加筛选条件, 首先创建treegrid列表 var tree = $("#TreeGrid").treegrid({ url:"cha ...
- WPF: 在ListView中添加Checkbox列表
描述:ListView是WPF中动态绑定工具的数据容器,本文实现了一个在ListView中显示的供用户选择的列表项目,并且控制列表中选择的项目数量,即实现单选. XAML中创建ListView,代码如 ...
- C# dev gridcontrol中添加checkbox复选框
文章来源 csdn weinierbian http://blog.csdn.net/weinierbian/article/details/6255402 添加一列,FieldName为 " ...
随机推荐
- 多MAVEN项目部署到tomcat中_之使用DBUG进行单步调试
1.改成你想localhost:8080默认进入的目录 这个步骤会造成 code\.settings\org.eclipse.wst.common.component 文件的更改<propert ...
- [转]SpringMVC拦截器简单教程
亲测有用,地址: http://blog.csdn.net/tjcyjd/article/details/7498236
- windows无法访问指定设备路径或文件。您可能没有合适的权限访问
试试退出杀毒软件试试,被杀毒软件阻拦了.
- 流媒体测试笔记记录之————解决问题video.js 播放m3u8格式的文件,根据官方的文档添加videojs-contrib-hls也不行的原因解决了
详细代码Github:https://github.com/Tinywan/PHPSharedLibrary/tree/master/Tpl/Html5/VideoJS 想播放hls协议的就是m3u8 ...
- 慕课网__css_padding && z_index
一个正方形 对于“内联元素”来说 z-index 静态布局没有z-index作用
- Map拷贝 关于对象深拷贝 浅拷贝的问题
问题:map拷贝时发现数据会变化. 高能预警,你看到的下面的栗子是不正确的,后面有正确的一种办法,如果需要看的话的,请看到底,感谢各同学的提醒,已做更正,一定要看到最后 先看例子: ...
- join / left join / right join
1 可以自己join自己 SELECT * FROM table_1 t1join table_1 ton t.target_id = t1.target_id 2 join要双方都满足才可以出现结果 ...
- java:经典消费生成者
产品类: public class Info { private String title = "生产"; private String content = "生产罐头& ...
- MySQL 显示版本、端口、状态
status select version() show global variables like 'port'
- swift_枚举 | 可为空类型 | 枚举关联值 | 枚举递归 | 树的概念
***************可为空的类型 var demo2 :we_demo = nil 上面这个代码串的语法是错的 为什么呢, 在Swift中,所有的类型定义出来的属性的默认值都不可以是nil ...