JQGridデータがJSONサーバーの応答でロードされていません

Question

jspレスポンスのデータをJSONJQGridを使用してロードしようとしています。 Javaオブジェクトから生成

私のindex.html

<pre> 
<script type="text/javascript" src="jqgrid/src/i18n/grid.locale-en.js"></script> 
<script type="text/javascript" src="jqgrid/src/grid.loader.js"></script> 
<script type="text/javascript" src="jqgrid/js/jquery.jqGrid.min.js"></script> 
</pre> 

function getEmployeeDetails(){ 
    jQuery("#list").jqGrid({ 
    datatype: function(postdata) { 
      jQuery.ajax({ 
       url: 'execute.jsp?command=command', 
       mtype:'POST', 
       datatype:"json", 
        colModel : [ 
        {name:'amount', width:30, sortable:true, align:'center'}, 
        {name:'age', width:40, sortable:false, align:'center'}, 
        {name:'name', width:180, sortable:true, align:'left'}, 
        {name:'total', width:380, sortable:true, align:'left'} 
        ], 

        jsonReader : { 
         root: "key", 
         page: "currentpage", 
         total: "total", 
         records: "totalrecords", 
         repeatitems: true, 
         cell: "cell", 
         id: "id", 
         userdata: "userdata" 
         }, 
         width: 700, 
         height: 200, 

        pager: '#pager', 
        sortorder: 'desc', 
        viewrecords: true, 
        caption: 'My first grid' 
      }); 
      } 
    }); 
}  

そして、私のexecute.jspコード

**<pre> 
response.setContentType("application/json"); 
response.getWriter().write(wr.toJSONString()); 
</pre>** 

私JSON string。

 
{ 
    "totalrecords":"20", 
    "tota1":"10", 
    "currentpage":"runCommand.jsp", 
    "key":[ 
    {"id":"1","cell":["12000","30","Myname","10000"]} 
    ] 
} 

データがテーブルにロードされていません。私は成功することができない様々な方法で努力しています。いつもテーブルが空になっていて、ロードしています.....助けてください。ここで間違っています...

Answer 1

あなたは間違った方法でdatatypeを使用します。 jQuery.ajaxを手動で呼び出す必要はありません.jqGridがこれを行います。 JavaScriptのコードは、次のようになります。

$(document).ready(function() { 
    $("#list").jqGrid({ 
     url: 'execute.jsp?command=command', 
     mtype:'POST', 
     datatype:"json", 
     colModel : [ 
      {name:'amount', width:30, align:'center'}, 
      {name:'age', width:40, sortable:false, align:'center'}, 
      {name:'name', width:180}, 
      {name:'total', width:380} 
     ], 
     jsonReader : { 
      root: "key", 
      page: "currentpage", 
      total: "total", 
      records: "totalrecords" 
     }, 
     width: 700, 
     height: 200, // the value 'auto' could be probably better 
     pager: '#pager', 
     sortorder: 'desc', 
     viewrecords: true, 
     caption: 'My first grid' 
    }); 
}); 

デモhereを参照してください。値"currentpage":"runCommand.jsp"をJSONデータから例えば"currentpage":"1"のような数値に修正する必要があります。