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 相关文章推荐
firefo xml 读写实现js代码
Jun 11 Javascript
分享一个用Mootools写的鼠标滑过进度条改变进度值的实现代码
Dec 12 Javascript
基于jquery实现拆分姓名的方法(纯JS版)
May 08 Javascript
ANGULARJS中使用JQUERY分页控件
Sep 16 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
Feb 21 Javascript
url中的特殊符号有什么含义(推荐)
Jun 17 Javascript
Angularjs中controller的三种写法分享
Sep 21 Javascript
微信小程序 常用工具类详解及实例
Feb 15 Javascript
html5+canvas实现支持触屏的签名插件教程
May 08 Javascript
微信小程序视图template模板引用的实例详解
Sep 20 Javascript
微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
Dec 11 Javascript
Node.js实现一个HTTP服务器的方法示例
May 13 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即时捕捉PHP中的错误并发送email通知的实现代码
2013/01/19 PHP
PHPExcel 修改已存在Excel的方法
2018/05/03 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
thinkphp5.1 框架导入/导出excel文件操作示例
2020/05/25 PHP
windows系统下简单nodejs安装及环境配置
2013/01/08 NodeJs
jquery获取一个元素下面相同子元素的个数代码
2014/07/31 Javascript
简介JavaScript中POSITIVE_INFINITY值的使用
2015/06/05 Javascript
JS实现超简单的鼠标拖动效果
2015/11/02 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
2016/03/09 Javascript
jQuery选择器及jquery案例详解(必看)
2016/05/20 Javascript
js+html5实现canvas绘制网页时钟的方法
2016/05/21 Javascript
jQuery+ajax+asp.net获取Json值的方法
2016/06/08 Javascript
微信小程序 首页制作简单实例
2017/04/07 Javascript
Bootstrap按钮组实例详解
2017/07/03 Javascript
基于Vue2.0+ElementUI实现表格翻页功能
2017/10/23 Javascript
nodejs+mongodb+vue前后台配置ueditor的示例代码
2018/01/02 NodeJs
jQuery获取随机颜色的实例代码
2018/05/21 jQuery
Node.js API详解之 timer模块用法实例分析
2020/05/07 Javascript
vue各种事件监听实例(小结)
2020/06/24 Javascript
总结python实现父类调用两种方法的不同
2017/01/15 Python
浅谈python3.x pool.map()方法的实质
2019/01/16 Python
Python如何使用paramiko模块连接linux
2020/03/18 Python
GUESS Factory加拿大:牛仔裤、服装及配饰
2019/09/20 全球购物
欧洲最古老的鞋厂:Peter Kaiser
2019/11/05 全球购物
美国最大的在线生存商店:Survival Frog
2020/12/13 全球购物
水电工岗位职责
2014/02/12 职场文书
中级会计职业生涯规划书
2014/03/01 职场文书
2014年物流工作总结
2014/11/25 职场文书
付款承诺函范文
2015/01/21 职场文书
艺术节开幕词
2015/01/28 职场文书
工会工作个人总结
2015/03/03 职场文书
小平您好观后感
2015/06/09 职场文书
详解python网络进程
2021/06/15 Python
python实现会员信息管理系统(List)
2022/03/18 Python
【海涛解说】史上最给力比赛,挑战DOTA极限
2022/04/01 DOTA
win10如何更改appdata文件夹的默认位置?
2022/07/15 数码科技