设置展开部分功能的实现：
1.首先需要获取点击事件，在所属活动后面加上扩展的代码：
onDblClickRow : function(index, field, value) {
//如果当前未选中行
if (editIndex == undefined) {
//将点击的index放在编辑的index中
editIndex = index;
//获取选中的行
$('#dg').datagrid('selectRow', index).datagrid(
'beginEdit', index);
}
},
//设置被打开行的样式
rowStyler : function(index, row) {
if (row.admin == 1) {
return 'background-color:#6293BB;color:#fff;font-weight:bold;';
}
}, view : detailview,
detailFormatter : function(index, row) {
return '<div style="padding:1px"><table class="ddv"></table></div>';
},
onExpandRow : function(index, row) {
var ddv = $(this).datagrid('getRowDetail', index)
.find('table.ddv');
ddv
.datagrid({
url : '../img.do',
fitColumns : true,
singleSelect : true,
rownumbers : true,
loadMsg : '',
queryParams : {
method : 'select',
gid : row.id
},
height : 'auto',
columns : [ [
{
field : 'id',
title : '序号',
width : 100
},
{
field : 'smallimg',
title : '小图',
width : 100,
align : 'center',
formatter : function(value,row, index) {
var flag = true;
if(flag){
return value= "<img src=\"../uploads/"+row.smallImg+"\" width=\"100px\" height=\"60px\" alt=\"活动尚未开始！！！\" />";
}else{
return value = "已下架商品！！"
}
return value;
},
},
{
field : 'midimg',
title : '中图',
width : 100,
align : 'center',
formatter : function(value,
row, index) {
var flag = true;
if(flag){
return value= "<img src=\"../uploads/"+row.midImg+"\" width=\"100px\" height=\"60px\" alt=\"活动尚未开始！！！\" />";
}else{
return value = "已下架商品！！"
}
return value;
},
},
{
field : 'bigimg',
title : '大图',
width : 100,
align : 'center',
formatter : function(value,
row, index) {
if(row.bigImg){
return value= "<img src=\"../uploads/"+row.bigImg+"\" width=\"100px\" height=\"60px\" alt=\"活动尚未开始！！！\" />";
}else{
return value = "已下架商品！！"
}
return value;
},
},
{
field : 'opt',
title : '操作设置',
width : 100,
align : 'right',
formatter : function(value,
row, index) {
var temp = "";
if (row.interpor == 0) {
temp = "<a class=\"easyui-linkbutton l-btn l-btn-small easyui-fluid\" style=\"width: 105px;\" href=\"javascript:setInterpor("
+ row.id
+ ")\" data-options=\"iconCls:'icon-add'\" group=\"\"><span class=\"l-btn-left l-btn-icon-left\" style=\"margin-top: 0px;\">"
+ "<span class=\"l-btn-text\">设置</span><span class=\"l-btn-icon icon-add\"> </span></span></a>";
} else {
temp = "<a class=\"easyui-linkbutton l-btn l-btn-small easyui-fluid\" style=\"width: 105px;\" href=\"javascript:setInterpor("
+ row.id
+ ")\" data-options=\"iconCls:'icon-add'\" group=\"\"><span class=\"l-btn-left l-btn-icon-left\" style=\"margin-top: 0px;\">"
+ "<span class=\"l-btn-text\">取消</span><span class=\"l-btn-icon icon-add\"> </span></span></a>";
}
return temp;
}
} ] ],
onResize : function() {
$('#dg')
.datagrid(
'fixDetailRowHeight',
index);
},
onLoadSuccess : function() {
setTimeout(function() {
$('#dg').datagrid(
'fixDetailRowHeight',
index);
}, 0);
}
});
$('#dg').datagrid('fixDetailRowHeight', index);
}
})
注意点：需要在jsp页面引入datagrid的js，如下
