jqGrid的Fomatter用於將圖片url地址轉換成前端圖片顯示的使用

背景: 基於SpringMVC的將存儲在MySql數據庫中的圖片URL地址讀出，然后轉換成Json文件，利用jqGrid將json的數據顯示出來，特別是讀出圖片的url地址然后轉換成圖片顯示出來；

jqGrid的官方文檔中文翻譯地址:http://blog.mn886.net/jqGrid/

jqGrid官方文檔：http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_formatter

文檔中的參數-方法-事件-文檔中的ColModel參數大全子菜單里面會發現一個formatter參數，並且后面還有例子，如下圖所示：

函數function參數列表里面有三個參數：cellvalue、options、rowObject
官方解釋為:

cellvalue：指的是需要被格式化的值，更准確的說是需要被格式化的當前單元格(cell)的值

options：是包含下面元素的一個對象

                {rowId:rid,colModel:cm} 

                 rowId: 行的id號

                 colModel:是對於從jqGrid的colModel數據獲取的列的屬性的對象

               簡單的說，就是當前cell的options設置

rowObject:以一種由數據類型(xml/xmlstring/json/jsonstring)選擇而決定的格式展示的行數據

                 有博客說:rowObject是當前cell所在row的值，如{ id=1, name="name1", price=123.1, ...}  ，也就是說代表的是當前行的數據

 

既然是需要將當前單元進行格式化，也就是對cellvalue進行操作代碼如下:

function imageFormat( cellvalue, options, rowObject ){


        return '<img src="'+cellvalue+ '"  style="width:50px;height:50px;" />';


}

 {name:'Logo',index:'Logo',align:"center" ,sortable:false,editable: true,width:30,formatter:imageFormat}, 

就可以將url地址對應的圖片顯示在單元格中

 

jqGrid還有待進一步的去學習！！！