1. 程式人生 > >easyUI的datagrid每行數據添加操作按鈕的方法

easyUI的datagrid每行數據添加操作按鈕的方法

gpo IT span iss 超鏈接 post col this string

今天做項目的時候,想在easyui的datagrid每一列數據後邊都加上一個操作按鈕,一開始想在後臺拼接字符串用JSON傳回,但是我測試之後發現這個方法不管用,在網上搜索了一下,整理如下:

其實要加一行自定義列很簡單,在js聲明datagrid的時候加上如下代碼

[javascript] view plain copy
  1. {field:‘operate‘,title:‘操作‘,align:‘center‘,width:$(this).width()*0.1,
  2. formatter:function(value, row, index){
  3. var str = ‘<a href="#" name="opera" class="easyui-linkbutton" ></a>‘;
  4. return str;
  5. }}

這行代碼是在columns屬性下定義的,而且一定要加上這個代碼

[javascript] view plain copy
  1. onLoadSuccess:function(data){
  2. $("a[name=‘opera‘]").linkbutton({text:‘下訂單‘,plain:true,iconCls:‘icon-add‘});
  3. },

如果不加這個,那個操作列就不會出現按鈕的樣式,只是一個超鏈接,用linkbutton或者其他按鈕的可以根據需求改編

最後效果如下

技術分享圖片

之後可以對a標簽做onclick事件之類的,視情況而定

easyUI的datagrid每行數據添加操作按鈕的方法