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 ...
随机推荐
- 1.golang的环境搭建及入门
安装包下载 下载链接:https://dl.google.com/go/go1.12.3.windows-amd64.msi 环境搭建 安装完成之后,找一个来存放go语言文件的文件夹,我这里选的是G: ...
- 关于JVM的一些冷知识
(1) Java加载类的一般顺序: 1.静态属性,静态方法声明,静态块. 2.动态属性,普通方法声明,构造块. 3.构造方法. 当加载一个类时,JVM会根据属性的数据类型第一时间赋默认值(一举生成的) ...
- list基本代码
#include<iostream> #include<list> //STL之list的基本用法 using namespace std; void outputList(l ...
- Android引入动态库so的方法
Android引入动态库so的方法 标签(空格分隔): Android so 第三方库 为了执行效率,会将一些CPU密集性任务如音视频解码.图像处理等放入到so中,还有也会将程序关键核心部分放入到so ...
- 虚拟机安装及配置(centOs7)
准备工作 a)下载VMware workstation14 b)下载CentOS7 CentOS7 c)下载xshell.xftp 安装参考 分区设置 补充(解决网络IP问题,设置IP,service ...
- 算法笔记 3.2 codeup1935 查找学生信息
#include <stdio.h> #include <string.h> const int maxn = 1e3; struct student{ ]; ]; //!!! ...
- Linux 文件查看,文件夹切换,权限查看
当前用户只操作当前用户目录 1. 输入终端显示内容: 用户 @ 系统 : 路径信息 $ $ 表示普通用户 家目录 # 表示超级用户 家目录 [sudo -i ] 使用root用户 : 使用 ...
- linux上静态库和动态库的编译和使用(附外部符号错误浅谈)
主要参考博客gcc创建和使用静态库和动态库 对于熟悉windows的同学,linux上的静态库.a相当于win的.lib,动态库.so相当于win的.dll. 首先简要地解释下这两种函数库的区别,参考 ...
- keil5 MDK 链接报错 Error: L6410W 解决
keil5 MDK 报错 Build target 'Project' linking... .\Output\Project.axf: Warning: L6310W: Unable to find ...
- [UE4]Tree View
类似List View,但Tree View要求提供树形结构的数据.Tree View和Tile View都是继承自List View 一.创建一个名为“TreeEntry”的UserWidget,添 ...