EasyUI的DataGrid每行数据添加操作按钮的实现代码


Posted in Javascript onAugust 22, 2017

今天做项目的时候,想在easyui的datagrid每一列数据后边都加上一个操作按钮,一开始想在后台拼接字符串用JSON传回,但是我测试之后发现这个方法不管用,在网上搜索了一下,整理如下:

其实要加一行自定义列很简单,在js声明datagrid的时候加上如下代码

{field:'operate',title:'操作',align:'center',width:$(this).width()*0.1, 
  formatter:function(value, row, index){ 
    var str = '<a href="#" rel="external nofollow" name="opera" class="easyui-linkbutton" ></a>'; 
    return str; 
}}

这行代码是在columns属性下定义的,而且一定要加上这个代码

onLoadSuccess:function(data){  
    $("a[name='opera']").linkbutton({text:'下订单',plain:true,iconCls:'icon-add'});  
},

如果不加这个,那个操作列就不会出现按钮的样式,只是一个超链接,用linkbutton或者其他按钮的可以根据需求改编

最后效果如下

EasyUI的DataGrid每行数据添加操作按钮的实现代码

之后可以对a标签做onclick事件之类的,视情况而定

总结

以上所述是小编给大家介绍的EasyUI的DataGrid每行数据添加操作按钮的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
腾讯的ip接口 方便获取当前用户的ip地理位置
Nov 25 Javascript
JS隐藏参数post传值实例
Apr 18 Javascript
JQuery表格内容过滤的实现方法
Jul 05 Javascript
在线一元二次方程计算器实例(方程计算器在线计算)
Dec 22 Javascript
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
Feb 12 Javascript
Node.js中使用事件发射器模式实现事件绑定详解
Aug 15 Javascript
BootStrap 可编辑表Table格
Nov 24 Javascript
jQuery、zepto、js常用小技巧
Feb 12 Javascript
Bootstrap笔记之缩略图、警告框实例详解
Mar 09 Javascript
Javascript之图片的延迟加载的实例详解
Jul 24 Javascript
PostgreSQL Node.js实现函数计算方法示例
Feb 12 Javascript
javascript局部自定义鼠标右键菜单
Dec 08 Javascript
浅谈箭头函数写法在ReactJs中的使用
Aug 22 #Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
Aug 22 #Javascript
bootstrap3-dialog-master模态框使用详解
Aug 22 #Javascript
关于JS与jQuery中的文档加载问题
Aug 22 #jQuery
bootstrap confirmation按钮提示组件使用详解
Aug 22 #Javascript
bootstrap multiselect下拉列表功能
Aug 22 #Javascript
浅谈Vue父子组件和非父子组件传值问题
Aug 22 #Javascript
You might like
php switch语句多个值匹配同一代码块的实现
2014/03/03 PHP
JavaScript创建命名空间的5种写法
2014/06/24 PHP
php使用gettimeofday函数返回当前时间并存放在关联数组里
2015/03/19 PHP
PHP实现RSA签名生成订单功能【支付宝示例】
2017/06/06 PHP
jquery使用ColorBox弹出图片组浏览层实例演示
2013/03/14 Javascript
在JavaScript并非所有的一切都是对象
2013/04/11 Javascript
Javascript脚本实现静态网页加密实例代码
2013/11/05 Javascript
jquery统计复选框选中示例
2013/11/05 Javascript
js获取浏览器基本信息大全
2014/11/27 Javascript
自己动手手写jQuery插件总结
2015/01/20 Javascript
实现前后端数据交互方法汇总
2015/04/07 Javascript
js实时获取并显示当前时间的方法
2015/07/31 Javascript
浅谈jquery选择器 :first与:first-child的区别
2016/11/20 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
Vuejs 用$emit与$on来进行兄弟组件之间的数据传输通信
2017/02/23 Javascript
jQuery基于Ajax实现读取XML数据功能示例
2018/05/31 jQuery
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
react MPA 多页配置详解
2019/10/18 Javascript
小程序实现多个选项卡切换
2020/06/19 Javascript
Python中针对函数处理的特殊方法
2014/03/06 Python
Python基于matplotlib实现绘制三维图形功能示例
2018/01/18 Python
在PyCharm导航区中打开多个Project的关闭方法
2019/01/17 Python
Pandas之Dropna滤除缺失数据的实现方法
2019/06/25 Python
django如何通过类视图使用装饰器
2019/07/24 Python
python中用ctypes模拟点击的实例讲解
2020/11/26 Python
HTML5中的Scoped属性使用实例
2014/04/23 HTML / CSS
html svg生成环形进度条的实现方法
2019/09/23 HTML / CSS
Weekendesk意大利:探索多种引人入胜的周末主题
2016/10/14 全球购物
英国在线房屋中介网站:Yopa
2018/01/09 全球购物
.NET remoting中对象激活的两种方式
2015/06/08 面试题
教师实习自我鉴定
2013/12/14 职场文书
中专生自我鉴定
2013/12/17 职场文书
新教师工作感言
2014/02/16 职场文书
学生上课迟到检讨书
2015/01/01 职场文书
新闻简讯格式及范文
2015/07/22 职场文书
MySQL中rank() over、dense_rank() over、row_number() over用法介绍
2022/03/23 MySQL