新手请教jquery easui datagrid的问题
1
最佳答案
1
可以的，通过Ext可以实现。
在Ext中你可以拼一个模板 然后根据模板添加数据，我这有个示例你可以研究下：
//按模板拼接界面
function GroupInterface() {
//合并总JOSN
var objData = {};
//列
var objCols = [];
if (objRole != undefined) {
for (var i = 0; i < objRole.length; i++) {
var cols = {};
cols.RoleID = objRole[i].Role_ID;
cols.RoleName = objRole[i].Role_Name;
cols.TempAuth = objRole[i].Role_Temp_Auth;
objCols.push(cols);
}
}
//行
var objRows = [];
if (objType != undefined || objRole != undefined) {
for (var j = 0; j < objType.length; j++) {
var rows = {};
rows.EnumCode = objType[j].EnumCode;
rows.EnumName = objType[j].EnumName;
var auths = [];
if (objManage == undefined || objManage.length <= 0) {
for (var y = 0; y < objRole.length; y++) {
var auth = {};
auth.TempAuth = objRole[y].Role_Temp_Auth;
auth.AllowAuthorize = 0;
auth.AllowDeferedAuth = 0;
auths.push(auth);
}
}
else if (objManage.length > 0) {
for (var y = 0; y < objRole.length; y++) {
var auth = {};
auth.TempAuth = objRole[y].Role_Temp_Auth;
var isauth = false; //是否授权
for (var k = 0; k < objManage.length; k++) {
if (objManage[k].RoleId.toLowerCase() == objRole[y].Role_ID.toLowerCase() && objType[j].EnumCode.toLowerCase() == objManage[k].AuthorizeType.toLowerCase()) {
auth.AllowAuthorize = objManage[k].AllowAuthorize;
auth.AllowDeferedAuth = objManage[k].AllowDeferedAuth;
isauth = true;
break;
}
}
if (!isauth) {
auth.AllowAuthorize = 0;
auth.AllowDeferedAuth = 0;
isauth = false;
}
auths.push(auth);
}
}
rows.Auths = auths;
objRows.push(rows);
}
}
objData = { cols: objCols, rows: objRows };
var tpl = new Ext.XTemplate(
'<table border="0" cellspacing="1" cellpadding="0" bgcolor="#EDEDED" style="width:100%;min-width:800px">',
'<tr class="color_1"><td style="background-color:#FAFAFA"> </td>',
'<tpl for="cols">',
'<tpl if="TempAuth == 0">',
'<td class="gridthed" style="text-align: center;height:24px;width:80px">{RoleName}</td>',
'</tpl>',
'<tpl if="TempAuth == 1">',
'<td class="gridthed" style="text-align: center;height:24px;width:200px" colspan="2">{RoleName}</td>',
'</tpl>',
'</tpl>',
'</tr>',
'<tr class="color_2"><td> </td>',
'<tpl for="cols">',
'<tpl if="TempAuth == 0">',
' <td class="gridthed" style="text-align: center;width: 80px;height:24px">授权</td>',
'</tpl>',
'<tpl if="TempAuth == 1">',
'<td class="gridthed" style="text-align: center;width:80px;height:24px">授权</td><td class="gridthed" style="text-align: center;width:120px">临时授权</td>',
'</tpl>',
'</tpl>',
'</tr>',
'<tpl for="rows">',
'<tr style="height:24px" class="{[xindex % 2 === 0 ? "color_2" : "color_1"]}">',
'<td style="text-align:left;width:200px;padding-left:10px">{EnumName}：</td>',
'<tpl for="Auths">',
'<tpl if="TempAuth == 0">',
'<tpl if="AllowAuthorize == 0 ">',
'<td class="gridthed" style="text-align: center;width:100px"><input id="{["cbx_allow_"+parent.EnumCode+"_"+xindex]}" type="checkbox" name="vehicle" /></td>',
'</tpl>',
'<tpl if="AllowAuthorize == 1 ">',
'<td class="gridthed" style="text-align: center;width:100px"><input id="{["cbx_allow_"+parent.EnumCode+"_"+xindex]}" checked type="checkbox" name="vehicle" /></td>',
'</tpl>',
'</tpl>',
'<tpl if="TempAuth == 1">',
'<tpl if="AllowAuthorize == 0 ">',
'<td class="gridthed" style="text-align: center;width:100px"><input id="{["cbx_allow_"+parent.EnumCode+"_"+xindex]}" type="checkbox" name="vehicle" /></td>',
'</tpl>',
'<tpl if="AllowAuthorize == 1 ">',
'<td class="gridthed" style="text-align: center;width:100px"><input id="{["cbx_allow_"+parent.EnumCode+"_"+xindex]}" checked type="checkbox" name="vehicle" /></td>',
'</tpl>',
'<tpl if="AllowDeferedAuth == 0 ">',
'<td class="gridthed" style="text-align: center;width:100px;"><input id="{["cbx_defered_"+parent.EnumCode+"_"+xindex]}" type="checkbox" name="vehicle" /></td>',
'</tpl>',
'<tpl if="AllowDeferedAuth == 1 ">',
'<td class="gridthed" style="text-align: center;width:100px"><input id="{["cbx_defered_"+parent.EnumCode+"_"+xindex]}" checked type="checkbox" name="vehicle" /></td>',
'</tpl>',
'</tpl>',
'</tpl>',
'</tr>',
'</tpl>',
'</table>'
);
tpl.overwrite('grid-example', objData);
}
收获园豆：30
嗯，好的，虽然我是用的jquery easui，不过思路应该差不多，上面那个图是我用.net的datagrid控件用模板列做的，粗看了一下你的代码，感觉都是一样的
@何小飞: 思路应该是差不多的 我附张图你看下效果：
上面的Checkbox我就是动态拼得
@JasonNET: 谢谢