给Jquery easyui 的datagrid 每行增加操作链接(转)
http://www.thinkphp.cn/code/207.html
通過(guò)formatter方法給Jquery easyui 的datagrid 每行增加操作鏈接
我們都知道Jquery的EasyUI的datagrid可以添加并且自定義Toolbar，這樣我們選擇一行然后選擇toolbar的相應(yīng)按鈕就可以對(duì)這行的數(shù)據(jù)進(jìn)行操作。但實(shí)際項(xiàng)目里我們可能需要在每行后面加一些操作鏈接，最常見(jiàn)的就是比如“修改”、“刪除”、“查看”之類。如下圖：
這是個(gè)很實(shí)用的功能，但是搜索了一下，好像也沒(méi)見(jiàn)到誰(shuí)寫過(guò)，我就找了Easyui的document，隨便寫一下，拋磚引玉。
思路：一般來(lái)講，增加操作鏈接就是要用URL+ID的方式把頁(yè)面跳轉(zhuǎn)到新頁(yè)面，所以需要在正常輸出的一行后面加一列操作列用來(lái)顯示操作鏈接。Easyui的Datagrid沒(méi)有直接添加link的屬性，所以我需要格式化一下這一“操作”列的輸出。
解決方法：
第一步，我需要 在datagrid行里添加一列，field指向id（field:'id'），然后對(duì)這列進(jìn)行格式化處理（formater：格式化函數(shù)），如下：
第二步：
根據(jù)documentation的描述，formatter的格式化函數(shù)有3個(gè)parameters，分別是：
value: the field value，也就是field:'id'。
rowData: the row record data。就是這一行的Json數(shù)據(jù)，包括你已經(jīng)選擇在Datagrid上顯示的內(nèi)容，和沒(méi)顯示的內(nèi)容。因?yàn)槲业腏son數(shù)據(jù)里包括了Id這一內(nèi)容，所以我可以直接調(diào)用。如果你作為數(shù)據(jù)源的Json里沒(méi)有Id屬性，需要修改一下Json的輸出。我的每行Json輸出是類似{"id":"1","name":"\u7ecf\u6d4e\u53d1\u5c55","parentId":"0"}的結(jié)構(gòu)
rowIndex: the row index.當(dāng)前行的Index。
所以我寫rowformater這個(gè)函數(shù)的時(shí)候，也需要用function rowformater(value,row,index)的方法。為了看起來(lái)清晰明白，我只在函數(shù)里寫了一句話（放在<head>標(biāo)簽里），事實(shí)上項(xiàng)目上需要做一些基本的判斷。：
OK，應(yīng)該能跑起來(lái)了。跑出的結(jié)果就是上面的截圖樣式。
?
注意：自己做了以后發(fā)現(xiàn)，如果UI中一行的多個(gè)列需要用到數(shù)據(jù)源中的同一列，那么可能會(huì)有問(wèn)題，需要把這UI中的多個(gè)列并到同一列中，共同使用數(shù)據(jù)源中的這同一列。
轉(zhuǎn)載于:https://www.cnblogs.com/Rising/p/3722294.html
總結(jié)
以上是生活随笔為你收集整理的给Jquery easyui 的datagrid 每行增加操作链接(转)的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 《Effective Java读书笔记》
- 下一篇： android插件化-apkplug框架