jqgridツリーがツリーの代わりにリストのように表示されない

Question

私はツリー構造のように見えるはずのjqgrid構成を持っています。代わりにフラットなリスト構造が表示されています。誰かが私に何が欠けているか教えてもらえますか？ triand.comサイトから

jquery/3.2.1/jquery.min.js, 
jqgrid/4.6.0/js/i18n/grid.locale-en.js, 
jqueryui/1.12.1/jquery-ui.min.js 

： は、ここで私はhtmlページに記載されている順に使用していたバージョンです

jqueryui/1.8.14/themes/redmond/jquery-ui.css, 
jqgrid/themes/ui.jqgrid.css (from triand.com), 
jqueryui/1.12.1/themes/smoothness/jquery-ui.css 

：私はまた、これらのCSSを使用しています

jqgrid/js/i18n/grid.locale-en.js 
jqgrid/js/jquery.jqGrid.min.js 

の順番に並べ替えます。私のグリッドはグッドブルーとは対照的に灰色に見えます。私は理由を理解できません。

$(document).ready(function(){ 
    $("#list").jqGrid({ 
     url : "/reconcile", 
     datatype : "json", 
     mtype : 'GET', 
     colModel : [ 
      {name: "id",width:1,hidden:true, key:true}, 
      {name : 'data.key.busnDate', label : 'Business Date', hidden:false, sorttype:"date", width : 80 }, 
      {name : 'data.product', label : 'Product', sorttype:"string", width : 50, editable : false}, 
      {name : 'data.quantityBought', label : 'Quantity Bought', sorttype:"int", width : 100, editable : false}, 
      {"name":"level","hidden":true}, 
      {"name":"parent","hidden":true}, 
      {"name":"isLeaf","hidden":true}, 
      {"name":"expanded","hidden":true}, 
      {"name":"uiicon","hidden":true} 
     ], 
     treeGrid: true, 
     pager : '#pager', 
     loadonce:false, 
     rowNum : 25, 
     height: 'auto', 
     rowList : [ 25,50,100,200 ], 
     sortname : 'key.positionId', 
     sortorder : 'asc', 
     viewrecords : true, 
     gridview : true, 
     multiselect: false, 
     multiboxonly: false, 
     autoencode: true, 
     caption : 'ARC Reconciliation', 
     emptyrecords: "No records to found for given date!", 
     jsonReader : { 
       repeatitems : true, 
     }, 
     treeIcons : { 
      "plus": "ui-icon-circlesmall-plus", 
      "minus": "ui-icon-circlesmall-minus", 
      "leaf" : "ui-icon-document" 
     }, 
     ExpandColumn: 'key.positionId' 
    }); 
    jQuery("#list").jqGrid('navGrid', '#pager', { 
     edit : false, 
     add : false, 
     del : false, 
     view : true, 
     search : true 
    }); 
    $('#datePick').datepicker({ 
     onSelect: function (dateText, inst) { 
      var e = $("#list").data("events"); 
      if (typeof (e) !== "undefined" && typeof (e.reloadGrid) !== "undefined") { 
       $("#list").trigger("reloadGrid"); 
      } 
     } 
    }); 
}); 

おかげ

Answer 1

あなたはあなたの問題の答えを得るために、私たちの新しいGuriddo jqGrid documentation hereで見ることができます。

はさらにこれに、あなたはそれがURL `から返されたテストデータを知っておくことが重要です