如何使JSON嵌套陣列子行中的jqGrid

我有本地JSON字符串如下：如何使JSON嵌套陣列子行中的jqGrid

var jsonObj = { 
     "page": "1", 
     "records": "2", 
     "rows": [ 
{"id":"1","firstName":"ABC","lastName":"XYZ","city":"blr","state":"Karnataka","arr":[ 
{"arr1":"value1","arr2":"value2"},{"arr1":"value3","arr2":"value4"}]}, 
     {"id":"2","firstName":"DEF","lastName":"PQR","city":"Mumbai","state":"Maharashtra","arr":[{"arr1":"result1","arr2":"result2"},{"arr1":"result3","arr2":"result4"}]}]};

使用jqgrid我想顯示兩行以上JSON字符串，有ID1和ID2，但是對於嵌套數組（即上面的字符串arr），我想將它們顯示爲其父行的子行，而不是作爲子網格。

除了兩列（即arr1和arr2）之外，子行中的其他列應包含作爲父行的重複數據。子行不應在加載時可見。子行應該展開的點擊應該有一個加號/ traingle圖標。

這是我用來顯示jqgrid的代碼。

$("#list").jqGrid({ 
       datastr : jsonObj, 
       datatype : "jsonstring", 
       colNames : [ 'Id', 'FirstName', 'LastName', 'City', 'State', 'Array1', 'Array2' ], 
       colModel : [ { 
         name : 'id', 
         index : 'id', 
         width : 100, 
         key : true 
       }, { 
         name : 'firstName', 
         index : 'firstName', 
         width : 150 

       }, { 
         name : 'lastName', 
         index : 'lastName', 
         width : 150 

       }, { 
         name : 'city', 
         index : 'city', 
         width : 100 

       }, { 
         name : 'state', 
         index : 'state', 
         width : 100 

       }, { 
         name : 'arr1', 
         index : 'arr1', 
         width : 100, 
         jsonmap : "arr.0.arr1" 
       }, { 

         name : 'arr2', 
         index : 'arr2', 
         width : 100, 
         jsonmap : "arr.0.arr2" 
       } ], 
       pager : '#pager', 
       rowNum : 10, 
       rowList : [ 10, 20, 30 ], 
       sortname : 'id', 
       sortorder : 'desc', 
       viewrecords : true, 
       gridview : true, 
       caption : 'JSON Array', 
       jsonReader : { 
         repeatitems : false, root: "rows" 
       } 
     });

來源

2015-08-15 Toni

在我看來，您確實需要使用子網格作爲網格，並根據父字符串的數據創建所需的子網格數據。查看the answer瞭解更多詳情。與引用的答案中一樣，您可以使用getLocalRow和父行ID來獲取父行的所有數據，並且可以使用來自父行數據的兩項數據填充數組。您可以像演示中一樣隱藏子網格的列標題。

來源

2015-08-15 19:07:24 Oleg

@奧列格：你提到的答案是非常有幫助的。非常感謝。但是，我仍然面臨着獲取子網格中的數據的問題。 data：$（this）.jqGrid（「getLocalRow」，pureRowId）沒有得到預期的數據。我做錯了什麼？對不起，問小問題，但我新jqgrid。 – Toni

@Toni：解決方案取決於您使用的jqGrid的分支以及版本。如果你使用[free jqGrid]（https://github.com/free-jqgrid/jqGrid），它是我的fork，那麼你可以添加'additionalProperties：[「arr」]'參數。在這種情況下，jqGrid將讀取數據。或者，您可以使用'datatype：「local」，data：jsonObj.rows'而不是'datatype：「jsonstring」，datastr：jsonObj'當前使用。在本地數據中保存'arr' proparty的本地數據和'$（this）.jqGrid（「getLocalRow」，pureRowId）'將包含'arr'屬性。所以你可以得到這個對象併爲子網格創建'data'。 – Oleg

再次感謝您的回覆。我曾經使用數據類型：「jsonstring」，datastr：jsonobj，這樣我就可以在colModel中使用jsonmap映射到arr內容，即第一行的value1和value2。我想要的是，應該有兩行（以及1-1 sub_rows/sub_grid），第一行應該有7列，即id，firstName，lastName，city，state，arr1，arr2，它們的值應該是1，ABC ，XYZ，blr，卡納塔克邦，值1，值2。現在，因爲id = 1的arr有兩個數組，所以第二行應在子網格中顯示值爲1，ABC，XYZ，blr，Karnataka，value3，value4。類似的第二行（和子行） – Toni

如何使JSON嵌套陣列子行中的jqGrid

回答

相關問題