通过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. cmake 版本升级

    1.在网址 https://cmake.org/files/v3.1/下载   cmake-3.1.0.tar.gz 2.解压 3.执行  ./configure 4.执行 make 5. 执行   ...

  2. iOS-读取txt文件中文乱码

    一.情景描述: 后台给一个txt文件,编码是utf-8,在Mac电脑Xcode开发环境下读取txt文件内容,汉字会出现乱码,英文没有乱码这种情况. 二.尝试解决方法: 修改编码格式,尝试了NSUTF1 ...

  3. 2017-2018-2 20179204《网络攻防实践》第十三周学习总结 python实现国密算法

    国密商用算法是指国密SM系列算法,包括基于椭圆曲线的非对称公钥密码SM2算法.密码杂凑SM3算法.分组密码SM4算法,还有只以IP核形式提供的非公开算法流程的对称密码SM1算法等. 第1节 SM2非对 ...

  4. L-Gap Substrings(uva 10829)

    题意:有一种形如uvu形式的字符串,其中u是非空字符串,且V的长度正好为L,那么称这个字符串为L-Gap字符串 给出一个字符串S,以及一个正整数L,问S中有多少个L-Gap子串. /* 这道题用到一个 ...

  5. 用来武装Firebug的十四款Firefox插件

    原文发布时间为:2010-04-24 -- 来源于本人的百度文章 [由搬家工具导入] 如果你是一名Web设计师,Firebug想必不会陌生,作为一款Firefox插件,它可能是网站前端开发最有用的工具 ...

  6. SQLite FTS5使用小技巧

    SQLite FTS5使用小技巧   在SQLite中,全文索引功能以扩展模块存在.使用全文索引,可以快速对大段文字进行搜索.SQLite提供FTS3.FTS4.FTS5三个模块.其中,FTS5是最新 ...

  7. idea---搭建maven,tomcat入门

    这篇随笔讲讲idea工具的安装和使用和在idea中搭建maven的分享. 一.概念 1.IntelliJ IDEA是什么? DEA 全称 IntelliJ IDEA,是java编程语言开发的集成环境. ...

  8. jQuery 基础学习

    jQuery 可以按照网站进行查看 http://jquery.cuishifeng.cn/ jQuery 模块  <=>类库 DOM/BOM/JavaScript的类库 一 查找元素 j ...

  9. delphi的^和@的作用

    Pint:^string;在这里将^放在数据类型之前,说明是声明的字符串指针类型!如果想取出指针引用的值的话,就将^放在声明的类型后就可以了,比如:Pint^想取Pint类型的所引用地址的话,就将@放 ...

  10. ef SaveChanges()报"更新条目时出错,有关详细信息请参见内部异常"

    报这个错误是因为表没有设置主键,设完主键后再重新更新Entity,就可以添加了