load store with parameter selected on another grid

Question

I have this code :

Ext.define('MyDesktop.Opport', {
extend: 'Ext.ux.desktop.Module',
requires: [
    'Ext.data.ArrayStore',
    'Ext.util.Format',
    'Ext.grid.Panel',
    'Ext.grid.RowNumberer',
/***********************/
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.panel.*'
/***********************/
],


id:'opp',
createWindow : function(){
    var storeop = Ext.create('Ext.data.JsonStore', {
        proxy: {
            type: 'ajax',
            url: 'PHP/afficherop.php',
            reader: {
                type: 'json',               // format fichier : JSON
                root: 'enregistrements',    // D?but des donn?es
                idProperty: 'id'            // cl? primaire
            }
        },
        fields: ['id','date','infos','idProd','idcl']
    });

    var storecl = Ext.create('Ext.data.JsonStore', {
        proxy: {
            type: 'ajax',

            url: 'PHP/afficher.php',
            reader: {
                type: 'json',               // format fichier : JSON
                root: 'enregistrements',    // D?but des donn?es
                idProperty: 'id'            // cl? primaire
            }
        },
        fields: ['id','type','nom','prenom','mat']
    });

    storecl.load();
    var desktop = this.app.getDesktop();
    var win = desktop.getWindow('opp');
    /*******************/
    if(!win){
        win = desktop.createWindow({
            id: 'opp',
            title:'Opportunités',
            width:500,
            height:480,
            iconCls: 'bogus',
            animCollapse:false,
            constrainHeader:true,
            layout: 'border',
            align: 'center',

            items: [
                {
                    xtype: 'grid',
                    flex: 1,
                    split: true,
                    border: true,
                    region: 'center',
                    store: storecl,

                    title: 'Client',
                    columns: [
                       // new Ext.grid.RowNumberer(),
                        {text: 'ID',dataIndex: 'id'},
                        { text: 'type',align: 'center',dataIndex: 'type'},
                        { text: 'nom',align: 'center',dataIndex: 'nom'},
                        { text: 'Prénom',align: 'center',dataIndex: 'prenom'},
                        { text: 'Matricule',align: 'center',dataIndex: 'mat'}
                    ],
                    listeners: {itemdblclick: function(grid ,record){
                    var rr = grid.getSelectionModel();
                    var rs = rr.getSelection();
                        var idc = rs[0].get('id');
                        Ext.Ajax.request({
                            url: 'PHP/op.php',
                            params: {
                                idcl: idc
                            }
                             });
                        storeop.load({params:{idcl: idc}});
                }}
                },{
                    xtype: 'grid',
                    flex: 1,
                    region: 'south',
                    border: true,
                    store: storeop,
                    title: 'Liste des opportunités',
                    columns: [
                        // new Ext.grid.RowNumberer(),
                        {text: 'ID',dataIndex: 'id'},
                        { text: 'Date',align: 'center',dataIndex: 'date'},
                        { text: 'Info',align: 'center',dataIndex: 'infos'},
                        { text: 'Produit',align: 'center',dataIndex: 'idProd'},
                        { text: 'CLient',align: 'center',dataIndex: 'idcl'}
                    ]
                }
            ]
        })
    }
    return win;
}
});

I want the second grid to dsiplay the records loaded from the store storeop with parameters selected from the first grid. Any help?

Answer 1

you can get the selected row from the first grid:

var selectedRecord = firstGrid.getSelectionModel().getSelection()[0];

here, i assume that you have a single selection model. To load this selectedRecord to your second grid, you have to loadData to its store.

list.push(selectedRecord.data);
secondGrid.store.loadData(list, false);

take note that you have to use different store for each grid.

Answer 2

You need a second Store instance for your second grid. Do not use the same store for both grids.