EazyUI Grid和TreeGrid的 CheckBox 模式

先上效果图





Grid 模式

$('#rdg').datagrid({
//pageNumber:1,
title:'角色列表',
striped: true,
iconCls:'icon-list' ,
//pagination:true,
rownumbers: true,
//singleSelect:true,
method: 'POST',
//pageSize:20,
//pageList:[20],
fitColumns:true,
fit:true,
url: '/User/getRole',
onBeforeLoad: function (param) {
param.falg = new Date();
param.id =$.trim($("#hidid").val());
},
loadMsg:'数据加载中请稍后……',
onLoadSuccess:function(data){
if(data){
$.each(data.rows, function(index, item){
if(item.ck=="1"){
$('#rdg').datagrid('checkRow', index);
}
});
}
},
columns : [ [
{field : 'ck',title : 'ck',width : 60,align : 'left',checkbox:true},
{field : 'name',title : '角色名',width : 60,align : 'left'},
{field : 'description',title : '描述',width : 240,align : 'left'}
] ]
});

grid 获取

var rows = $('#rdg').datagrid("getChecked");

TreeGrid

var treeData=[];

$('#rdg').treegrid({
idField: 'id',
treeField: 'title',
//pageNumber:1,
title:'菜单列表',
striped: true,
iconCls:'icon-list' ,
animate:true,
//pagination:true,
rownumbers: true,
singleSelect:false,
method: 'POST',
//pageSize:20,
//pageList:[20],
fitColumns:true,
fit:true,
//url: '/User/getRole',
loadMsg:'数据加载中请稍后……',
onLoadSuccess:function(){
if(treeData.length>0){
$.each(treeData, function(index, item){
if(item.ck=="1"){
$('#rdg').treegrid('checkRow',item.id);
}
});
}
},
columns : [ [
{field : 'ck',title : 'ck',width : 60,align : 'left',checkbox:true},
{field : 'icon',title : '图标',width : 30,align : 'center',formatter:function(value,row,index){
return "<span class='"+value+"'>    </span>";
}},
{field : 'title',title : '标题',width : 240,align : 'left'}
] ]
});
$("#rdg").treegrid("loading");
$.post("/Role/getMenu",{flag:new Date().getTime(),id:$.trim($("#hidid").val())},function(data){
treeData=data;
var rows=arrayToTree(data,"id","pid");
$('#rdg').treegrid("loadData",rows);
$("#rdg").treegrid("loaded");
});

treegrid 获取

var rows = $('#rdg').treegrid("getChecked");