需要引入文件datagrid-detailview.js
js代码:
$(function(){
$("#data-list").datagrid({
view: detailview,
title:'订单',
url:getRootPath()+'/reUserOrder/dataList.do',
idField : "order_id",//唯一键字段
rownumbers: true,//行显示编号
fit : true, // 自适应
fitColumns : true,// 是否有横向滚动条 false:有
nowrap : false, //列超出长度,换行
pagination:true,
rownumbers:true,
sortName:'create_time',
sortOrder:'desc',
pageSize:20,//每页显示数量
pageList:[10,20,30,50],//可选数量
columns:[[
{field:'order_id',checkbox:true},
{field:'order_number',title:'订单号',align:'center',sortable:true,width:100,
formatter:function(value,row,index){
return row.order_number;
}
},
{field:'total_price',title:'支付金额',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return "¥"+row.total_price;
}
},
{field:'balance_pice',title:'平台余额',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return "¥"+row.balance_pice;
}
},
{field:'freight_fee',title:'运费',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return "¥"+row.freight_fee;
}
},
{field:'remarke',title:'备注',align:'center',sortable:true,width:100,
formatter:function(value,row,index){
return row.remarke;
}
},
{field:'create_time',title:'创建日期',align:'center',sortable:true,width:100,
formatter:function(value,row,index){
return row.create_time;
}
},
]],
detai在这里插入代码片lFormatter:function(index,row){//注意2
return '<table id="ddv-' + index + '"></table>';
},
onExpandRow:function(index,node){
$('#ddv-'+index).datagrid({
url:getRootPath()+"/reUserOrderDetal/dataList.do?order_id="+node.order_id,
idField : "order_details_id",//唯一键字段
fitColumns : true,// 是否有横向滚动条 false:有
nowrap : true, //列超出长度,换行
columns:[[
{field:'order_details_id',hidden:true},
{field:'acount',title:'数量',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return row.acount;
}
},
{field:'price',title:'价格',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return row.price;
}
},
{field:'all_price',title:'商品总价',align:'center',sortable:true,width:50,
formatter:function(value,row,index){
return row.all_price;
}
},
{field:'create_time',title:'操作时间',align:'center',sortable:true,width:100,
formatter:function(value,row,index){
return row.create_time;
}
},
]],
onResize:function(){
$('#centerdatagrid').datagrid('fixDetailRowHeight',index);
},
onLoadSuccess:function(){
setTimeout(function(){
$('#data-list').datagrid('fixDetailRowHeight',index);//在加载爷爷列表明细(即:父列表)成功时,获取此时整个列表的高度,使其适应变化后的高度,此时的索引
$('#data-list').datagrid('fixRowHeight',index);//防止出现滑动条
},0);
}
});
$('#data-list').datagrid('fixDetailRowHeight',index);
},
});
});
//搜索
function seach(){
var company_name = $('#company_name').textbox('getValue');
var state = $('#state').combobox('getValue');
var start_time=$('#startTime').val();
var end_time=$('#endTime').val();
$("#data-list").datagrid("reload",{"state":state,"company_name":company_name,"startTime":start_time,"endTime":end_time});
$("#searchForm").form("clear"); //清除表单数据
}
//重置
function seachClear(){
$("#searchForm").form("clear"); //清除表单数据
$("#data-list").datagrid("reload",{"order_number":""});
}
jsp代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body class="easyui-layout">
<!-- Search panel end -->
<!-- Data List -->
<div region="center" border="false" >
<table id="data-list"></table>
</div>
<script type="text/javascript" src="<%=basePath%>/js/jquery-easyui-1.3.2/datagrid-detailview.js"></script>
<script type="text/javascript" src="<%=basePath%>/view/ant/order/page-reUserOrder.js"></script>
</body>
</html>