How to add Toolbar search for tree grid in jqgrid

Question

I am facing an issue in jqgrid's treegrid. For local data the tool barserch is not working and if add change the treegrid as false in colModel its works fine in the sense it is acting as a ordinary grid. i have pasted my code below for your reference

$(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"});

});

score 0 · Accepted Answer · edited May 23 '17 at 10:00

There are probably a misunderstanding with my previous answer on the trirand forum. Tree Grid feature of jqGrid work almost only with remote data received from the server per ajax. With respect of some tricks which you use it is do possible to display the local data in the tree grid. Nevertheless you still has very restricted features. For example the local data filtering will not works.

In my answer on your question I supposed that you will use server side data filtering and the server will gives back the subset of tree nodes which corresponds the filter criteria. I'am sorry for the misunderstanding.

How to add Toolbar search for tree grid in jqgrid

1 Answers1