easyui datagrid自己定义操作列
通过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自己定义操作列的更多相关文章
- Easyui datagrid 数据表格 表格列头右键菜单选择展示列 JS
Easyui ,数据表格加载出来以后,在表格头右键,会有显示筛选的功能: 如图: 然后可以取消勾选,就变成下面这个样子: 功能的实现是通过重写了easyui 的 $.fn.datagrid.defau ...
- easyui DataGrid 工具类之 列属性class
public class ColumnVO { /** * 列标题文本 */ private String title; /** * 列字段名称 */ pr ...
- easyUI datagrid 多行多列数据渲染异常缓慢原因以及解决方法
原因 最近,在优化之前公司帮联想(外包)做的一个老的后台管理系统,由于项目是基于easy UI框架,页面是后台用jsp实现的,再加上在公司推行前后端分离的实践,大部分项目都基于vue采用前后端分离去实 ...
- jquery easyui datagrid 动态 加载列
实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...
- jquery easyui DataGrid 动态的改变列显示的顺序
$.extend($.fn.datagrid.methods,{ columnMoving: function(jq){ return jq.each(function(){ var target = ...
- 扩展jQuery easyui datagrid增加动态改变列编辑的类型
$.extend($.fn.datagrid.methods, { addEditor : function(jq, param) { if (param instanceof Array) { $. ...
- easyui datagrid 表格中操作栏 按钮图标不显示
jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染 解决办法: 使用解析器 Parser(解析器) $.parser.parse(); // 解析所有页面 $.par ...
- 用JavaScript方式创建easyUI datagrid Column Group(列组)
代码如下: <script type="text/javascript"> var datagrid; $(function(){ $('#datagrid').dat ...
- 关于EasyUI datagrid 表头居中 数据列内容居右 或者居左
cell.css("text-align",(col.halign||col.align||"")); 这里有个属性挺眼熟 : col.align 前面还有一个 ...
随机推荐
- 1 - Django安装
一.Python安装 在Mac系统下,系统自带python开发环境,打开终端,输入python,我们就可以看到当前python版本号,例如我的系统是OS X EI Caption 10.11.1,自带 ...
- iOS资讯详情页实现—WebView和TableView混合使用(转)
iOS资讯详情页实现—WebView和TableView混合使用 如果要实现一个底部带有相关推荐和评论的资讯详情页,很自然会想到WebView和TableView嵌套使用的方案. 这个方案是WebVi ...
- POJ 1236 Network of Schools Tarjan缩点
Network of Schools Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 22729 Accepted: 89 ...
- EntityFramework4.1 MODEL代码生成器 database first
原文发布时间为:2011-04-02 -- 来源于本人的百度文章 [由搬家工具导入] Generating EF Code First model classes from an existing d ...
- [LeetCode] Balanced Binary Tree 深度搜索
Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...
- shell文本过滤编程(一):grep和正则表达式【转】
转自:http://blog.csdn.net/shallnet/article/details/38799739 版权声明:本文为博主原创文章,未经博主允许不得转载.如果您觉得文章对您有用,请点击文 ...
- WSL学习:安装ArchLinux和Root/Cling以及注意事项
1.前言 在Windows下使用Linux常见的软件存在许多困难.选择之一是使用VMWare和VirtualBox之类的虚拟机软件,另一种选择是使用类UNIX模拟环境,如Cygwin,GNUWin32 ...
- Flask 服务器设置host=0.0.0.0之后外部仍然无法访问, 使用命令python *.py run启动OK
IP设置成0.0.0.0,还是不能外部访问 if __name__ == '__main__': app.run(host=, debug=True) 使用的Pycharm IDE,使用的三角号运行的 ...
- LeetCode OJ-- Pow(x, n) **@
https://oj.leetcode.com/problems/powx-n/ 二分法 class Solution { public: double pow(double x, int n) { ...
- Codeforces Gym101473 F.Triangles-前缀和 (2013-2014 ACM-ICPC Brazil Subregional Programming Contest)
前缀和. 代码: 1 #include<iostream> 2 #include<cstring> 3 #include<cstdio> 4 #include< ...