的jqGrid - JSON以JSON響應

Question

這在jqgrid - json looping issue與差繼續循環問題與colModel，我已經感動colNames和colModel到JSON。

JSON

{ 
    "colModel": [ 
     { 
      "name": "linkimg", 
      "index": "linkimg", 
      "width": 60, 
      "align": "left", 
      "jsonmap": "cells.0.links" 
     } 
    ], 
    "colNames": [ 
     "linkimg" 
    ], 
    "mypage": { 
     "outerwrapper": { 
      "page": "1", 
      "total": "1", 
      "records": "1", 
      "innerwrapper": { 
       "rows": [ 
        { 
         "id": "1", 
         "read": true, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-A", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            }, 
            { 
             "name": "link3" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "2", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-B", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "3", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-C", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "4", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-D", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "5", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-E", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "6", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-F", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "7", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-G", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "8", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-H", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "9", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-I", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "10", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-J", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "11", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-K", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "12", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-L", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "13", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-M", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "14", 
         "read": false, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-N", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        }, 
        { 
         "id": "15", 
         "read": true, 
         "cells": [ 
          { 
           "label": "linkimg", 
           "value": "Link-O", 
           "links": [ 
            { 
             "name": "link1" 
            }, 
            { 
             "name": "link2" 
            } 
           ] 
          } 
         ] 
        } 
       ] 
      } 
     } 
    } 
} 

jqGrid的定義

$(document).ready(function() { 
    $.ajax({ 
     type: "GET", 
     url: "myjqgrid.json", 
     data: "", 
     dataType: "json", 
     success: function(response){ 
      var columnData = response.mypage.outerwrapper, 
       columnNames = response.colNames, 
       columnModel = response.colModel; 

      $("#myjqgrid").jqGrid({ 
       datatype: 'jsonstring', 
       datastr: columnData,     
       colNames: columnNames, 
       colModel: columnModel, 
       jsonReader: { 
        root: "innerwrapper.rows",    
        repeatitems: false 
       }, 
       gridview: true, 
       pager: "#Pager", 
       rowNum: 2, 
       rowList: [2, 4, 6, 8], 
       viewrecords: true,    
       recordpos: 'left', 
       multiboxonly: true, 
       multiselect: true, 
       sortname: 'id', 
       sortorder: "desc", 
       sorttype: "text", 
       sortable: true, 
       caption: "<h2>My JQGrid</h2>", 
       width: "1406",  
       height: "100%", 
       scrolloffset: 0,  
       loadonce: true,  
       cache: true, 
       loadComplete: function(data){ 

       } 
      }); 
     } 
    }); 
    $("#myjqgrid").jqGrid('navGrid','#Pager'); 

}); 

問題

如何採取formatter:出colModel的？如果我將它保存在JSON中，那麼jqgrid不會顯示。

Answer 1

如果您不需要unformatter你可以用格式化延長預定義的格式化列表：

$.fn.fmatter.myLinkFormatter = function (val, options, rawObject) { 
    .... 
}; 

，然後在列定義

{ 
    "colModel": [ 
     { 
      "name": "linkimg", 
      "index": "linkimg", 
      "width": 60, 
      "align": "left", 
      "formatter": "myLinkFormatter", 
      "jsonmap": "cells.0.links" 
     } 
    ], 
    "colNames": [ 
     "linkimg" 
    ], 
    "mypage": { 
     "outerwrapper": { 
     ... 
    } 
} 

使用"formatter": "myLinkFormatter"見the demo。

還有一點評論：你應該在success之內移動$("#myjqgrid").jqGrid('navGrid','#Pager');像我在演示中所做的那樣。