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 相关文章推荐
jQuery阻止同类型事件小结
Apr 19 Javascript
自动设置iframe大小的jQuery代码
Sep 11 Javascript
Egret引擎开发指南之运行项目
Sep 03 Javascript
JavaScript将字符串转换为整数的方法
Apr 14 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
Sep 12 Javascript
分享jQuery网页元素拖拽插件
Dec 01 Javascript
深入理解Node.js的HTTP模块
Oct 12 Javascript
浅析Node.js:DNS模块的使用
Nov 23 Javascript
详解Bootstrap各式各样的按钮(推荐)
Dec 13 Javascript
JavaScript基本语法_动力节点Java学院整理
Jun 26 Javascript
js图片放大镜实例讲解(必看篇)
Jul 17 Javascript
一些可能会用到的Node.js面试题
Jun 15 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
Protoss热键控制
2020/03/14 星际争霸
php的urlencode()URL编码函数浅析
2011/08/09 PHP
淘宝ip地址查询类分享(利用淘宝ip库)
2014/01/07 PHP
PHP多维数组遍历方法(2种实现方法)
2015/12/10 PHP
Laravel接收前端ajax传来的数据的实例代码
2017/07/20 PHP
Prototype使用指南之hash.js
2007/01/10 Javascript
document.open() 与 document.write()的区别
2007/08/13 Javascript
JavaScript 页面编码与浏览器类型判断代码
2010/06/03 Javascript
可在线编辑网页文字效果代码(单击)
2013/03/02 Javascript
利用jquery包将字符串生成二维码图片
2013/09/12 Javascript
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
微信小程序 JS动态修改样式的实现代码
2017/02/10 Javascript
作为老司机使用 React 总结的 11 个经验教训
2017/04/08 Javascript
vue+axios实现登录拦截的实例代码
2017/05/22 Javascript
JS请求servlet功能示例
2017/06/01 Javascript
jQuery开源组件BootstrapValidator使用详解
2017/06/29 jQuery
jQuery中.attr()和.data()的区别分析
2017/09/03 jQuery
详解nodejs解压版安装和配置(带有搭建前端项目脚手架)
2018/12/06 NodeJs
vue项目首屏打开速度慢的解决方法
2019/03/31 Javascript
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
Vue 动态添加路由及生成菜单的方法示例
2019/06/20 Javascript
详解jQuery中的prop()使用方法
2020/01/05 jQuery
手写Vue2.0 数据劫持的示例
2021/03/04 Vue.js
python Django批量导入数据
2016/03/25 Python
Python元组拆包和具名元组解析实例详解
2018/03/26 Python
Python 列表去重去除空字符的例子
2019/07/20 Python
Java程序员面试题
2013/07/15 面试题
优良学风班总结材料
2014/02/08 职场文书
关于清明节的演讲稿
2014/09/13 职场文书
试用期转正员工自我评价
2014/09/18 职场文书
2014最新党员批评与自我批评材料
2014/09/24 职场文书
车辆年检委托书范本
2014/10/14 职场文书
2014年销售经理工作总结
2014/12/01 职场文书
2015年个人招商工作总结
2015/04/25 职场文书
Python道路车道线检测的实现
2021/06/27 Python
Mysql忘记密码解决方法
2022/02/12 MySQL