Ext.getCmp and Ext.ComponentQuery.query gives same object but not giving same result when used

I have two classes defined one for Grid and other for the form which is opened when add new is clicked in grid.

Gridview class

Ext.define('CustomerApp.view.CustomerGridView',
 {
     extend: 'Ext.container.Viewport',
     renderTo: Ext.getBody(),
     itemId: 'gridView'});

Form class

  Ext.define('CustomerApp.view.FormWindow',

     {
     extend : 'Ext.window.Window',
     closable:true,
     itemId: 'addCustomerWindow'})

When Add button is pressed in grid, window opens with form.

code to show form

     AddCustomer: function()
                        {
                        var win = Ext.create('CustomerApp.view.FormWindow');
                        Ext.ComponentQuery.query('#gridView')[0].add(win);
                        win.show();

                        }

After submit is clicked on form, it must add customer and close form. When I use Ext.getCmp it closes but not when Component query is used.

code to close the form:

    var gridView = Ext.getCmp('gridView');
    //var gridView= Ext.getComponentQuery.query('#gridView')[0];

    var formWindow = Ext.getCmp('addCustomerWindow');
    //var formWindow=Ext.getComponentQuery.query('#addCustomerWindow')[0];

    gridView.remove(formWindow);

I checked in console, both are returning me same object but using Ext.getCmp() closes the form but not Ext.ComponentQuery.query()


Source: forms

Leave a Reply