如何在jqgrid中添加工具栏搜索树网格

时间:2011-06-07 10:50:45

标签: jquery-plugins jqgrid treegrid

我在jqgrid的treegrid中遇到了一个问题。对于本地数据,工具barserch不起作用,如果add在colModel中将treegrid更改为false,则它在充当普通网格的意义上工作正常。我已粘贴下面的代码供您参考

$(document).ready (function () {
    var mydata = [
        { id:"AA", name:"012356",   num:"07/15/2009", debit:"121212",credit:"Adam Opel GmbH", balance:"LAMBDA SENSOR", enbl:"Bosch",
          level:"0", parent:"",  isLeaf:false, expanded:false },
        { id:"AB", name:"001", num:"07/15/2009",   debit:"121212",credit:"Adam Opel GmbH", balance:"LAMBDA SENSOR", enbl:"Bosch",
          level:"1", parent:"AA", isLeaf:false, expanded:false },
        { id:"AC", name:"124", num:"07/15/2009",debit:"121212",credit:"Adam Opel GmbH", balance:"LAMBDA SENSOR", enbl:"Bosch",
          level:"2", parent:"AB", isLeaf:true,  expanded:false },
        { id:"AD", name:"002", num:"07/11/2009",debit:"121212",credit:"Adam Opel GmbH", balance:"LAMBDA SENSOR", enbl:"Bosch",
          level:"1", parent:"AA", isLeaf:true,  expanded:false },
        { id:"AE", name:"012456", num:"01/13/2009",debit:"454545 ",credit:"General Motors LLC", balance:"LINKAGE, WIPER", enbl:"Bosch",
          level:"0", parent:"",  isLeaf:false, expanded:true },
        { id:"AF", name:"000", num:"04/1/2011",debit:"454545",credit:"General Motors LLC", balance:"LINKAGE, WIPER", enbl:"Bosch",
          level:"1", parent:"AE", isLeaf:true,  expanded:false },
        { id:"AG", name:"001", num:"08/15/2009",debit:"454545",credit:"General Motors LLC", balance:"LINKAGE, WIPER", enbl:"Bosch",
          level:"1", parent:"AE", isLeaf:true,  expanded:false },
        { id:"AI", name:"0X2345", num:"07/15/2010",debit:"2424",credit:"GM Manufacturing Poland", balance:"MOTOR-REAR WIPER", enbl:"Bosch",
          level:"0", parent:"",  isLeaf:true,  expanded:false }
        ],
        grid = $("#treegrid");

    grid.jqGrid({
        datatype: "local",
        data: mydata, // will not used at the loading,
                      // but during expanding/collapsing the nodes
        colNames:["id","Contract#","Eff Date","Part#","Legal Entity","Part Description","Buyer Name"],
        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'}
        ],
        height:'100%',
        rowNum: 1000,
        //pager : "#ptreegrid",
       // rowList : [5,10,20],
        sortname: 'id',
        viewrecords: true,
        treeGrid: true,
        treeGridModel: 'adjacency',
        treedatatype: "local",
        ExpandColumn: 'name',
        //altRows:true,
        //altclass:'myAltRowClass',
        caption: "Search Screen Output",
        loadComplete : function(){
            $("#treegrid").setGridWidth(1085,true);
            $("#treegrid").setGridHeight(470,true);
        },
        gridComplete: function ()
        {
            $(".treeclick","#treegrid").each(function() {
                    if($(this).hasClass("tree-plus"))
                    $(this).trigger("click");

            });
        }

    });
    // we have to use addJSONData to load the data
    grid[0].addJSONData({
        total: 1,
        page: 1,
        records: mydata.length,
        rows: mydata
    });

    grid.jqGrid('filterToolbar', {stringResult: true, searchOnEnter: false, defaultSearch : "cn"});

});

1 个答案:

答案 0 :(得分:0)

在三角形论坛上可能与my previous answer存在误解。 jqGrid的Tree Grid功能几乎只能与每个ajax从服务器接收的远程数据一起工作。关于您使用的some tricks,可以在树形网格中显示本地数据。然而,你仍然有非常有限的功能。例如,本地数据过滤不起作用

在我对你的问题的回答中,我认为你将使用服务器端数据过滤,服务器将返回对应过滤条件的树节点子集。我很抱歉误会了。