如何通过ID选择Extjs网格并将其显示在面板上

Question

I have created an array with data, a store with this data and a grid. All these exist inside a callback ajax function (the array with the data is the response of a POST request).

  var ajaxurl = 'requests/requestKomvus.php', // script to run
        data =  {datastr:datastr}; // data to pass
        $.post(ajaxurl, data, function (response) {
            var myData = [
              ['Company1',71.72,0.02],
             ['Company2',29.01,0.42],
             ['Company3',83.81,0.28],
             ['Company4',52.55,0.01]
             ];


           var store = new Ext.data.ArrayStore({
            fields: [
               {name: 'company'},
               {name: 'price', type: 'float'},
               {name: 'change', type: 'float'},
            ]
          });
          store.loadData(myData);

         var grid = Ext.create('Ext.grid.Panel', {
          store: store,
          columns: [
           {id:'company',header: "Company", width: 160, sortable: true, dataIndex: 'company'},
           {header: "Price", width: 75, sortable: true, dataIndex: 'price'},
           {header: "Change", width: 75, sortable: true, dataIndex: 'change'},
          ],
          stripeRows: true,
          height:940,
          width:500        
        });.... //end of ajax request

What I want is to get the "grid" variable inside my items element:

     items: [{
                        xtype: 'panel',
                        title: 'Images',
                        items: [{contentEl:'img',autoScroll:true, height:940 }],


                        },{ 
                        xtype: 'panel',
                        title: 'Material',
                        items: [{contentEl:'msg',autoScroll:true,height:940 }]
                        },
                        {   
                        xtype: 'panel',
                        title: 'Check',
                        items: [grid],  //// how to put it here?
                        }]
            }],renderTo : Ext.getBody()

Is there some straight forward way doing this using extjs? For example defining in my grid an Id and then get the variable with this id?

Answer 1

After re-reading the question. First of all, declare everything outside the AJAX call. Declare the store, data & grid outside. Then in your panel, you must simply put your grid on the items array:

var store = ....
var grid = ...

// ...
{   
    xtype: 'panel',
    title: 'Check',
    items: [
        grid
    ]
}

If you need to update your grid data within the AJAX request, you can do it calling loadData as you're doing right now.