通过formatter方法给Jquery easyui 的datagrid 每行添加操作链接

我们都知道Jquery的EasyUI的datagrid能够加入而且自己定义Toolbar。

这样我们选择一行然后选择toolbar的对应button就能够对这行的数据进行操作。

但实际项目里我们可能须要在每行后面加一些操作链接。比方“改动”、“删除”、“查看”之类。例如以下图:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaXRteWhvbWUxOTkw/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />

第一步,须要在datagrid行里加入一列,fieid指向id(fieid:'id'),

然后对这列进行格式化处理(formater:格式化函数),例如以下:

<th data-options="field:'ID',width:60,align:'center',formatter:formatOper">操作</th>

第二步,formatter的格式化函数有3个參数。各自是:

value:字段的值,也就是fidid:'id'.

rowData:行数据,就是一行的JSON数据.

rowIndex:行索引,当前行的Index.

所以须要一个formatOper函数,仅仅做一个简单的返回

<script type="text/javascript">
function formatOper(val,row,index){
return '<a href="'+row["ID"]+'">改动</a>';
}
</script>

easyui datagrid自己定义操作列的更多相关文章

  1. Easyui datagrid 数据表格 表格列头右键菜单选择展示列 JS

    Easyui ,数据表格加载出来以后,在表格头右键,会有显示筛选的功能: 如图: 然后可以取消勾选,就变成下面这个样子: 功能的实现是通过重写了easyui 的 $.fn.datagrid.defau ...

  2. easyui DataGrid 工具类之 列属性class

    public class ColumnVO { /**     * 列标题文本     */    private String title; /**     * 列字段名称     */    pr ...

  3. easyUI datagrid 多行多列数据渲染异常缓慢原因以及解决方法

    原因 最近,在优化之前公司帮联想(外包)做的一个老的后台管理系统,由于项目是基于easy UI框架,页面是后台用jsp实现的,再加上在公司推行前后端分离的实践,大部分项目都基于vue采用前后端分离去实 ...

  4. jquery easyui datagrid 动态 加载列

    实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...

  5. jquery easyui DataGrid 动态的改变列显示的顺序

    $.extend($.fn.datagrid.methods,{ columnMoving: function(jq){ return jq.each(function(){ var target = ...

  6. 扩展jQuery easyui datagrid增加动态改变列编辑的类型

    $.extend($.fn.datagrid.methods, { addEditor : function(jq, param) { if (param instanceof Array) { $. ...

  7. easyui datagrid 表格中操作栏 按钮图标不显示

    jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染 解决办法: 使用解析器 Parser(解析器) $.parser.parse();       // 解析所有页面 $.par ...

  8. 用JavaScript方式创建easyUI datagrid Column Group(列组)

    代码如下: <script type="text/javascript"> var datagrid; $(function(){ $('#datagrid').dat ...

  9. 关于EasyUI datagrid 表头居中 数据列内容居右 或者居左

    cell.css("text-align",(col.halign||col.align||"")); 这里有个属性挺眼熟 : col.align 前面还有一个 ...

随机推荐

  1. windows server 2008 密码破解

    个人是不太喜欢windows 系统的,但有时候没办法  业务已经用在Windows系统上面,今天碰到管理员密码还忘记了的情况,在此记录下 破解密码的过程 1.下载小白菜装机版u盘制作PE启动,详情参考 ...

  2. 解决ie8下面placeholder显示问题

    今天测试反馈一个bug,需要在ie8下面看到placeholder提示,开始的想法是对ie8进行降级处理,在ie8下面就不显示了. 现在测试反馈了,解决办法. function isLowIE() { ...

  3. pat 甲级 1080. Graduate Admission (30)

    1080. Graduate Admission (30) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue It ...

  4. python实现贪吃蛇

    贪吃蛇的算法还是比较简单的,蛇的移动我是通过不停添加一个head方块,然后判断应该加到蛇头的哪个方向,加完后删掉蛇尾就行了,如果吃到食物就不删蛇尾. 只是一个贪吃蛇只需要70行代码左右就可以了,后来又 ...

  5. POJ 3090

    Visible Lattice Points Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 8397   Accepted: ...

  6. form快速转json serialize

    原文发布时间为:2011-03-28 -- 来源于本人的百度文章 [由搬家工具导入] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...

  7. 2017-2018 ACM-ICPC, NEERC, Southern Subregional Contest A E F G H I K M

    // 深夜补水题,清早(雾)写水文 A. Automatic Door 题意 \(n(n\leq 1e9)\)个\(employee\)和\(m(m\leq 1e5)\)个\(client\)要进门, ...

  8. python的上下文管理

    说道上下文管理首先想到的就是这个: class MyResource: def __enter__(self): print("查询开始") return self def __e ...

  9. TopCoder SRM 675 Div1 Problem 500 LimitedMemorySeries1(分块)

    题意  给定一个长度不超过$5*10^{6}$的数列和不超过$100$个询问,每次询问这个数列第$k$小的数,返回所有询问的和 内存限制很小,小到不能存下这个数列.(数列以种子的形式给出) 时限$10 ...

  10. 【WEB基础】HTML & CSS 基础入门(8)表单

    前面 前面我们已经熟悉了网页上一些常见的元素,如在网页上显示一段文字.一张图片.一个列表.一张表格等等.这些东西都是事先编辑好显示在页面上只提供给用户看的,实际上,我们可以把这样的页面称之为静态页面. ...