網頁

2017/12/4

jQuery 在jqGrid的欄位中加入按鈕

在jqGrid的列表中如要加入按鈕,可使用Custom Formatter

在jqGrid的colModel屬性的欄位定義中,可使用formatter屬性來定義自己要的欄位樣式,所以若要在欄位加入按鈕,則可以定義如下。

jQuery("#gridid").jqGrid({
...
  colModel: [ 
    {name:'欄位1', formatter:function(cellvalue, options, rowObject) {
      return "<button type="button" onclick="alert(options.rowId)">選擇</button>" // 返回的html即為欄位中的樣式
    }}, 
    {name:'欄位2',...}
    {name:'欄位3',...}, ... 
  ],
...
});

或是formatter函式可以拉出來寫。

jQuery("#gridid").jqGrid({
...
  colModel: [ 
    {name:'欄位1', formatter:showButton}, // 記得後面不能加括弧() 
    {name:'欄位2',...}
    {name:'欄位3',...}, ... 
  ],
...
});

function showButton (cellvalue, options, rowObject) {
  return "<button type="button" onclick="alert(options.rowId)">選擇</button>" // 返回的html即為欄位中的樣式
}

沒有留言:

張貼留言