jqGrid treegrid，以編程方式展開節點

我正在嘗試使用jqGrid treegrid功能。任何人都可以解釋爲什麼'expandNode'方法在這個例子中不起作用？（在Chrome和JQ 1.4.2下測試）。jqGrid treegrid，以編程方式展開節點

注意1：我無法獲得的任何的展開或摺疊方法來做任何事情。他們更改圖標的外觀，但子行不會消失。如果我手動點擊圖標，外觀會改變，並且子行按預期隱藏。

注2：展開/摺疊ROW和展開/摺疊NODE有什麼區別？注3：我在jqGrid維基上發現了一些關於使用setTimeOut的條目，但我認爲這是與想要在初始加載時擴展所有內容有關的條目。如下所示，我想根據點擊來完成它。

$(document).ready(function() { 

    var table = $("<table id=treegrid></table>"); 

    $("body").append(table); 

    grid = $("#treegrid"); 

    /* DIRECT COPY FROM SO http://stackoverflow.com/questions/6788727/jqgrid-tree-grid-with-local-data */ 
    var mydata = [ 
     { id:"1", name:"Cash", num:"100", debit:"400.00",credit:"250.00", balance:"150.00", enbl:"1", 
      level:"0", parent:"", isLeaf:false, expanded:false, loaded:true }, 
     { id:"2", name:"Cash 1", num:"1", debit:"300.00",credit:"200.00", balance:"100.00", enbl:"0", 
      level:"1", parent:"1", isLeaf:false, expanded:false, loaded:true }, 
     { id:"3", name:"Sub Cash 1", num:"1",debit:"300.00",credit:"200.00", balance:"100.00", enbl:"1", 
      level:"2", parent:"2", isLeaf:true, expanded:false, loaded:true }, 
     { id:"4", name:"Cash 2", num:"2",debit:"100.00",credit:"50.00", balance:"50.00", enbl:"0", 
      level:"1", parent:"1", isLeaf:true, expanded:false, loaded:true }, 
     { id:"5", name:"Bank\'s", num:"200",debit:"1500.00",credit:"1000.00", balance:"500.00", enbl:"1", 
      level:"0", parent:"", isLeaf:false, expanded:true, loaded:true }, 
     { id:"6", name:"Bank 1", num:"1",debit:"500.00",credit:"0.00", balance:"500.00", enbl:"0", 
      level:"1", parent:"5", isLeaf:true, expanded:false, loaded:true }, 
     { id:"7", name:"Bank 2", num:"2",debit:"1000.00",credit:"1000.00", balance:"0.00", enbl:"1", 
      level:"1", parent:"5", isLeaf:true, expanded:false, loaded:true }, 
     { id:"8", name:"Fixed asset", num:"300",debit:"0.00",credit:"1000.00", balance:"-1000.00", enbl:"0", 
      level:"0", parent:"", isLeaf:true, expanded:false, loaded:true } 
     ], 

    grid = $("#treegrid"); 

    grid.jqGrid({ 
     datatype: "jsonstring", 
     datastr: mydata, 
     colNames:["Id","Account","Acc Num","Debit","Credit","Balance","Enabled"], 
     colModel:[ 
      {name:'id', index:'id', width:1, hidden:true, key:true}, 
      {name:'name', index:'name', width:180}, 
      {name:'num', index:'acc_num', width:80, align:"center"}, 
      {name:'debit', index:'debit', width:80, align:"right"}, 
      {name:'credit', index:'credit', width:80,align:"right"}, 
      {name:'balance', index:'balance', width:80,align:"right"}, 
      {name:'enbl', index:'enbl', width: 60, align:'center', 
      formatter:'checkbox', editoptions:{value:'1:0'}, 
      formatoptions:{disabled:false}} 
     ], 
     height: 'auto', 
     gridview: true, 
     rowNum: 10000, 
     sortname: 'id', 
     treeGrid: true, 
     treeGridModel: 'adjacency', 
     treedatatype: "local", 
     ExpandColumn: 'name', 
     caption: "Demonstrate how to use Tree Grid for the Adjacency Set Model", 
     jsonReader: { 
      repeatitems: false, 
      root: function (obj) { return obj; }, 
      page: function (obj) { return 1; }, 
      total: function (obj) { return 1; }, 
      records: function (obj) { return obj.length; } 
     } 
    }); 
    /* END DIRECT COPY */  

    var f = $("<button>ExpandCash</button>"); 

    $("body").append(f); 

    // Test reloading and summarization changes 
    f.bind("click",function() { 
     var rec = $("#treegrid").getRowData("1"); 
     //console.log(JSON.stringify(rec)); 
     $("#treegrid").expandNode(rec); 
     $("#treegrid").expandRow(rec); 
    }); 

});

來源

2011-09-30 GregT

Aha ！我認爲答案是，而不是'getRowData'，你必須使用'getLocalRow'。去搞清楚！ – GregT

我能得到它的目標是根節點來擴展（然後第二頭;我格爲3級深）使用此代碼：

function Expand() { 
    var rows = $("#treeGrid").jqGrid('getRootNodes'); 
    for (var i = 0; i < rows.length; i++){ 
     var childRows = $("#treeGrid").jqGrid('getNodeChildren', rows[i]); 
     $("#treeGrid").jqGrid('expandNode', rows[i]);  
     $("#treeGrid").jqGrid('expandRow', rows[i]); 
     for (var j = 0; j < childRows.length; j++) { 
      $("#treeGrid").jqGrid('expandNode', childRows[j]);  
      $("#treeGrid").jqGrid('expandRow', childRows[j]); 
     } 
    } 
}

一個簡單的點擊放在裏面功能，這將展開所有節點。數據格式應該不重要，但我使用json數據。嵌套'for'循環並不總是最好的方式，但我沒有看到另一種解決方案適用於我;它不應該是壞的，但除非你有大量的嵌套節點。

注意：此代碼對您的treegrid所具有的級數很敏感;你將需要額外的循環（或另一種方法）超過3個級別（級別0 = root，級別1 =第一個標題，級別2 =葉子），並且不需要2級樹的內部循環

來源

2012-09-11 16:47:58 ZeroK

jqGrid treegrid，以編程方式展開節點

回答

相關問題