在很多时候我们要在表格的最后添加一列操作列,easyUI貌似没有提供种功能,不过没关系,我们可以自定义来实现
首先是HTML部分
<table id="tt" class="easyui-datagrid" style="100%;height:554px"
singleSelect="false"
fitColumns="true"
title="部门列表"
rownumbers="true"
pagination="true"
conCls="icon-search"
toolbar="#tb2"
url="${pageContext.request.contextPath}/order/getAllOrder.do">
<thead>
<tr>
<th field="ck" checkbox="true"></th>
<th field="order_code" width="80">订单编号</th>
<th field="consumer.consumer_name"
data-options="formatter:function(value,rec){return rec.consumer.consumer_name}"
width="80">客户名称</th>
<th field="employees.emp_realname"
data-options="formatter:function(value,rec){return rec.employees.emp_realname}"
width="80">下单员工</th>
<th field="order_time" width="80" formatter="formatOrderDate">下单时间</th>
<th field="order_state" width="80" formatter="formatOrderState">订单状态</th>
<th data-options="field:'_operate',80,align:'center',formatter:formatOper">订单详情</th>
</tr>
</thead>
</table>
function formatOper(val,row,index){
return '<a href="#" onclick="editUser('+index+')">订单详情</a>';
}
/*
formatOper()函数中有三个参数,val指当前单元格的值,row,当前行对象,index当前行的索引.这里我们就需要这个index
我把这个index传入了一个叫editUser的函数中,为什么要传这个index呢,我们在来看下这个editUser函数
*/