easyui datagrid自定义按钮列,即最后面的操作列
在很多时候我们要在表格的最后添加一列操作列,easyUI貌似没有提供种功能,不过没关系,我们可以自定义来实现
首先是HTML部分
<table id="tt" class="easyui-datagrid" style="width: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',width: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函数
*/
easyui datagrid自定义按钮列,即最后面的操作列的更多相关文章
- easyui datagrid自定义按钮列,即最后面的操作列(转)
做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,不过没关系,我们可以自定义来实现 版本:jQuery easyUI 1.3.2 这里我的实现方式是采用HTML形式 ...
- easyui datagrid 表头固定(垂直滚动条)、列固定(水平滚动条)
easyui datagrid 表头固定(垂直滚动条).列固定(水平滚动条),每页显示1000行 最近用多了easyui 之后还是觉得它的功能还是很强大的.它原有的功能就已经能够满足90%以上的界面需 ...
- 完美实现保存和加载easyui datagrid自定义调整列宽位置隐藏属性功能
需求&场景 例表查询是业务系统中使用最多也是最基础功能,但也是调整最平凡,不同的用户对数据的要求也不一样,所以在系统正式使用后,做为开发恨不得坐在业务边上,根据他们的要求进行调整,需要调整最多 ...
- Easyui datagrid自定义排序
做项目遇到个关于排序问题,想着在前端排序,正好Easyui有这个功能,所以就拿来用了一下,因为跟官网的Demo不太一样,所以总结一下: 首先这一列是要排序的列(当然,在生产环境,这一列是隐藏的,在开发 ...
- EasyUI Datagrid 自定义列、Foolter及单元格编辑
1:自定义列,包括 Group var head1Array = []; head1Array.push({ field: 'Id', title: 'xxxx', rowspan: 2 }); he ...
- easyui datagrid自定义操作列
通过formatter方法给Jquery easyui 的datagrid 每行增加操作链接 我们都知道Jquery的EasyUI的datagrid可以添加并且自定义Toolbar, 这样我们选择一行 ...
- easyui datagrid使用按钮
$('#datagrid').datagrid({ border:false, fitColumns:true, singleSelect: true, url:url, columns:[[ {fi ...
- easyui datagrid 自定义单元格单击与双击事件(Day_38)
$(function(){ $('#tableId').datagrid({//单击事件 onClickRow:function(rowIndex,rowData){ alert("单 ...
- elementUI vue table status的状态列颜色变化和操作列状态显示(停用, 启用)
<div id="app" style="display: none"> ... <el-table-column prop="st ...
随机推荐
- leetcode 421.Maximum XOR of Two Numbers in an Array
题目中给定若干个数,然后任意选定两个数使得其异或值最大. 先利用样例中的: 3 10 5 25 2 8 这些数转换为二进制来看的话那么是先找到最高位的1然后与数组中其他的数相与后的数值保存到set中去 ...
- 启动tomcat报错Status 状态为 Deployment failed
- VS2010添加虚拟机发布的WebService引用
首先,WebServer已在虚拟机中完成发布.在网页中浏览可以看到如下所示内容 需要注意的是在发布时要给网站设置IP地址.如果在添加网站时没有设置,之后可以在网站绑定中进行修改.步骤如下: 1.选中网 ...
- Google - Find Most People in Chat Log
1. 给你一个chatting log file,format大概是这样的: A: bla B: bla bla C: bla bla bla 要你找出说话最多(看word number) 的K个人 ...
- 【SpringBoot】SpringBoot2.0响应式编程
========================15.高级篇幅之SpringBoot2.0响应式编程 ================================ 1.SprinBoot2.x响应 ...
- 将string转为同名类名,方法名。(c#反射)
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace stri ...
- 实战 ant design pro 中的坑
1.替换mock数据: 1.将:.roadhogrc.mock.js 中的代理模式替换 当不使用代理的时候就会将所有 /api/的链接换成 http://localhost:8080/ export ...
- googletest--Death Test和Exception Test
Death Test验证某个状态会使进程以某个错误码和错误消息离开 #include <gtest\gtest.h> #include "MyStack.h" // D ...
- 在Docker中监控Java应用程序的5个方法
译者注:Docker是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux机器上,也可以实现虚拟化.通常情况下,监控的主要目的在于:减少宕机 ...
- 理解OpenShift(1):网络之 Router 和 Route
理解OpenShift(1):网络之 Router 和 Route 理解OpenShift(2):网络之 DNS(域名服务) 理解OpenShift(3):网络之 SDN 理解OpenShift(4) ...