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 相关文章推荐
JavaScript的原型继承详解
Feb 15 Javascript
深入理解JavaScript的React框架的原理
Jul 02 Javascript
jQuery绑定自定义事件的魔法升级版
Jun 30 Javascript
如何写好你的JavaScript【推荐】
Mar 02 Javascript
jQuery操作之效果详解
May 19 jQuery
微信小程序如何像vue一样在动态绑定类名
Apr 17 Javascript
微信小程序 MinUI组件库系列之badge徽章组件示例
Aug 20 Javascript
VuePress 静态网站生成方法步骤
Feb 14 Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
Sep 20 Javascript
React Native 混合开发多入口加载方式详解
Sep 23 Javascript
jQuery实现小火箭返回顶部特效
Feb 03 jQuery
Vue微信公众号网页分享的示例代码
May 28 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中unserialize返回false的解决方法
2014/09/22 PHP
使用XHProf查找PHP性能瓶颈的实例
2017/12/13 PHP
jquery的$getjson调用并获取远程的JSON字符串问题
2012/12/10 Javascript
JavaScript获取页面中表单(form)数量的方法
2015/04/03 Javascript
node.js下LDAP查询实例分享
2015/09/30 Javascript
JS组件Bootstrap实现弹出框和提示框效果代码
2015/12/08 Javascript
js实现纯前端的图片预览
2016/04/27 Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
2017/02/07 Javascript
用Fundebug插件记录网络请求异常的方法
2019/02/21 Javascript
Vue项目中配置pug解析支持
2019/05/10 Javascript
使用Vue.js 和Chart.js制作绚丽多彩的图表
2019/06/15 Javascript
jQuery实现王者荣耀手风琴效果
2020/01/17 jQuery
[01:03:00]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第一局
2016/02/25 DOTA
[43:03]完美世界DOTA2联赛PWL S2 PXG vs Magma 第二场 11.21
2020/11/24 DOTA
python抓取京东价格分析京东商品价格走势
2014/01/09 Python
Python编程中的文件操作攻略
2015/10/16 Python
Python输出汉字字库及将文字转换为图片的方法
2016/06/04 Python
老生常谈Python序列化和反序列化
2017/06/28 Python
Python基于time模块求程序运行时间的方法
2017/09/18 Python
python+tkinter编写电脑桌面放大镜程序实例代码
2018/01/16 Python
TensorFlow平台下Python实现神经网络
2018/03/10 Python
对numpy中数组元素的统一赋值实例
2018/04/04 Python
详解TensorFlow查看ckpt中变量的几种方法
2018/06/19 Python
python批量复制图片到另一个文件夹
2018/09/17 Python
python交互模式下输入换行/输入多行命令的方法
2019/07/02 Python
python SVM 线性分类模型的实现
2019/07/19 Python
快速解决Django关闭Debug模式无法加载media图片与static静态文件
2020/04/07 Python
购买200个世界上最好的内衣品牌:Bare Necessities
2017/02/11 全球购物
在网上学习全世界最好的课程:Coursera
2017/11/07 全球购物
DJI大疆德国官方商城:大疆无人机
2018/09/01 全球购物
舞蹈兴趣小组活动总结
2014/07/07 职场文书
班主任与学生安全责任书
2014/07/25 职场文书
2014年检验科工作总结
2014/11/22 职场文书
承诺书范本
2015/01/21 职场文书
锅炉工岗位职责
2015/02/13 职场文书
Node与Python 双向通信的实现代码
2021/07/16 Javascript