Rumah  >  Artikel  >  hujung hadapan web  >  实例详解EasyUI的DataGrid每行数据添加操作按钮

实例详解EasyUI的DataGrid每行数据添加操作按钮

小云云
小云云asal
2017-12-30 14:35:467792semak imbas

easyui的datagrid每一列数据后边都加上一个操作按钮,怎么实现此功能呢?下面小编给大家带来了EasyUI的DataGrid每行数据添加操作按钮的实现代码,需要的朋友参考下吧,希望能帮助到大家。

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


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

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


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

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

最后效果如下

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

相关推荐:

EasyUi控件中的Datagrid详解

详解EasyUI的DataGrid绑定Json数据源方法

EasyUI之dataGrid的行内编辑

Atas ialah kandungan terperinci 实例详解EasyUI的DataGrid每行数据添加操作按钮. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn