简体   繁体   中英

How to checked true extjs treepanel checkbox on button click programatically?

I have an Extjs treepanel to which I have added a number of layers. Also, I have a search panel containing a search button. When search button is clicked, it returns the results in a extjs gridview.

I want to show layers by clicking on gridviews row and set checkbox of treepanel to true either dynamically or programatically
I have added tree panel like

var layerTree = new Ext.tree.TreePanel({
    border: true,
    root: layerList,
    split: true,
    containerScroll: true,
    collapseMode: "mini",
    autoScroll: true,
    loader: new Ext.tree.TreeLoader({
        applyLoader: false,
        uiProviders: {
            "layernodeui": LayerNodeUI
        }
    }),
    root: {
        nodeType: "async",
        children: Ext.decode(treeConfig)
    },
    listeners: {
        "radiochange": function(node) {}
    },
    rootVisible: false,
    lines: false

});

And I want like layernode.checked=true

Thanks Akatum You said

In your grid configuration you need to setup listener for itemclick event, which is fired when user click on row in grid. In this listener you need to get information about layer from row record. Then you can find layer node in tree by Ext.data.TreeStore getNodeById method and set its checked attribute to true

So in your grid configuration you will have:

listeners: {
    itemclick: function(c, record) {
        // get layer id from clicked row record
        var layerId = record.get('layerId');

        // find layer node in tree by layer id
        var node = layerTree.getStore().getNodeById(layerId);

        // set node checked attribute to true
        node.set('checked', true);
    }
}

I tried your code but its not working. I have added your suggested code in my code like this

var grid = new Ext.grid.GridPanel({
     store: new Ext.data.JsonStore({
         fields: action.result.fields,
         listeners: {
             load: function() {
                 setTimeout(function() {
                     grid.getSelectionModel().selectFirstRow();
                 }, 100);
             }
         }
     }),
     frame: true,
     columns: action.result.columns,
     stripeRows: true,
     listeners: {
         itemclick: function(c, record) {
             var layerId = record.get('layerId');
             var node = layerTree.getStore().getNodeById(layerId);
             node.set('checked', true);
         }
     }
 });

In your grid configuration you need to setup listener for itemclick event, which is fired when user click on row in grid. In this listener you need to get information about layer from row record. Then you can find layer node in tree by Ext.data.TreeStore getNodeById method and set its checked attribute to true

So in your grid configuration you will have:

listeners: {
    itemclick: function(c, record) {
        // get layer id from clicked row record
        var layerId = record.get('layerId');

        // find layer node in tree by layer id
        var node = layerTree.getStore().getNodeById(layerId);

        // set node checked attribute to true
        node.set('checked', true);
    }
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM