通过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. git 生成patch和打patch

    有这样的 目录层次 x/xx/xxx/xxx/ttt.c而 我的 当前位置 是在 x/下 ,执行git diff> test.patch 在test.patch补丁文件里的路径信息是这样的:- ...

  2. [暑假集训--数论]poj2909 Goldbach's Conjecture

    For any even number n greater than or equal to 4, there exists at least one pair of prime numbers p1 ...

  3. Codeforces 297C. Splitting the Uniqueness

    C. Splitting the Uniqueness time limit per test:1 second memory limit per test:256 megabytes input:s ...

  4. 【CF778C】Peterson Polyglot(Trie树,启发式合并)

    题意:有一棵n个结点的只由小写字母组成的Trie树,给定它的具体形态,问删除哪一层后剩下Trie树的结点数最少 n<=3e5 思路:先建出原Trie树,对于每一层的每一个结点计算删除后对答案的贡 ...

  5. git ssh 生成步骤

    Git是分布式的代码管理工具,远程的代码管理是基于SSH的,所以要使用远程的Git则需要SSH的配置. github的SSH配置如下: 一 . 设置Git的user name和email: $ git ...

  6. [LeetCode] Sum Root to Leaf Numbers dfs,深度搜索

    Given a binary tree containing digits from 0-9 only, each root-to-leaf path could represent a number ...

  7. 【Visual Studio】error c4996: 'fopen': This function or variable may be unsafe(转)

    原文转自 http://blog.csdn.net/zhangyuehuan/article/details/12012635 [解决方案]项目 =>属性 =>c/c++  =>预处 ...

  8. Manjaro linux软件源设置

    1.从官方http://jaist.dl.sourceforge.net/project/manjarotest/16.06-dev/kde/minimal/manjaro-kde-minimal-1 ...

  9. Action 和 Func 的用法以及区别

    Action 无返回值 Func 有返回值,且最后一个参数为返回值 Action用法 public static void test(string s) { Console.WriteLine(&qu ...

  10. jemalloc原理分析

    netty4引入了内存池的概念,它的主要思想源自于jemalloc,由于难以理解netty中这一块的代码,我决定先看一看网上的相关文章 官方git jemalloc原理分析 jemalloc和内存管理 ...