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 相关文章推荐
B/S开发中常用javaScript技术与代码
Mar 09 Javascript
javascript 火狐(firefox)不显示本地图片问题解决
Jul 05 Javascript
javascript prototype 原型链
Mar 12 Javascript
JS链式调用的实现方法
Mar 07 Javascript
IE8下String的Trim()方法失效的解决方法
Nov 08 Javascript
js实现简易的单数字随机抽奖(0-9)
Mar 19 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
Angular Module声明和获取重载实例代码
Sep 14 Javascript
jquery 实现回车登录详解及实例代码
Oct 23 Javascript
angularjs $http实现form表单提交示例
Jun 09 Javascript
基于Vue2x实现响应式自适应轮播组件插件VueSliderShow功能
May 16 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
浅谈箭头函数写法在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
使用网络地址转换实现多服务器负载均衡
2006/10/09 PHP
兼容firefox,chrome的网页灰度效果
2011/08/08 PHP
php post大量数据时发现数据丢失问题解决方法
2015/06/20 PHP
PHP中调用C/C++制作的动态链接库的教程
2016/03/10 PHP
php自定义时间转换函数示例
2016/12/07 PHP
PHP addslashes()函数讲解
2019/02/03 PHP
jquery 注意事项与常用语法小结
2010/06/07 Javascript
js中settimeout方法加参数的使用实例
2014/02/27 Javascript
JavaScript通过正则表达式实现表单验证电话号码
2014/03/07 Javascript
JavaScript中判断原生函数检查function是否是原生代码
2014/09/09 Javascript
js css 实现遮罩层覆盖其他页面元素附图
2014/09/22 Javascript
原生Javascript封装的一个AJAX函数分享
2014/10/11 Javascript
解决js下referer兼容各大浏览器的方法
2014/11/03 Javascript
Javascript字符串浏览器兼容问题分析
2014/12/01 Javascript
整理Javascript基础入门学习笔记
2015/11/29 Javascript
用Vue.js实现监听属性的变化
2016/11/17 Javascript
Javascript中字符串和数字的操作方法整理
2017/01/22 Javascript
bootstrap Table的一些小操作
2017/11/01 Javascript
详解Node.js异步处理的各种写法
2019/06/09 Javascript
Ant Design的Table组件去除
2020/10/24 Javascript
[02:10]DOTA2 TI10勇士令状玩法及不朽Ⅰ展示:焕新世界,如你所期
2020/05/29 DOTA
tensorflow获取变量维度信息
2018/03/10 Python
python2.7安装图文教程
2018/03/13 Python
python 创建一个空dataframe 然后添加行数据的实例
2018/06/07 Python
selenium在执行phantomjs的API并获取执行结果的方法
2018/12/17 Python
python 一个figure上显示多个图像的实例
2019/07/08 Python
python取均匀不重复的随机数方式
2019/11/27 Python
YOOX美国官方网站:全球著名的多品牌时尚网络概念店
2016/09/11 全球购物
大专毕业生简历的自我评价
2013/10/20 职场文书
打架检讨书50字
2014/01/11 职场文书
《三顾茅庐》教学反思
2014/04/10 职场文书
竞选学习委员演讲稿
2014/04/28 职场文书
家长意见书
2015/06/04 职场文书
董事会决议范本
2015/07/01 职场文书
实例详解Python的进程,线程和协程
2022/03/13 Python
Java后端 Dubbo retries 超时重试机制的解决方案
2022/04/14 Java/Android