将loadMask（）仅应用于extjs中的网格窗格不起作用

我想使用它的id将加载掩码仅应用于我的网格窗格， var myMask=new Ext.LoadMask{msg:Please wait…，目标：Ext.ComponentQuery.query'grid'[0]}； myMask.show； 但这似乎不起作用。相同的代码适用于选项卡窗格。请建议进行必要的更改，以实现仅用于网格面板的负载屏蔽

//View code

Ext.define("DummyApp.view.grid.GenericGrid",{
    extend: "Ext.panel.Panel",
    requires: ['DummyApp.view.toolBar','DummyApp.view.formPanel','Ext.state.*','Ext.data.*'],
    controller: "genericGrid",
    alias:"widget.genericgrid",
    initComponent: function(){
        Ext.apply(this, {
            items: [this.createToolbar(),this.createGrid()]
        });
        this.callParent(arguments);        
    },
     createToolbar: function(){
        this.toolbar = Ext.create('DummyApp.view.toolBar');
        return this.toolbar;
     },
     createGrid: function(){
        this.grid = Ext.create('Ext.grid.Panel',{
            itemId: 'batchGrid',
            columnLines : true,
            selType: 'cellmodel',
            autoScroll :true,
            maxHeight:535,
            stateId: 'GridPanel',
            loadMask: true,
            stateful: true,
            bind:{
                store:'{genericGrid}'
            }       
        });
        return this.grid;
     }   


//Controller code
 renderData: function(genericGrid) {
          var store = Ext.create("DummyApp.store.GenericGrid"),
              gridId = genericGrid.up().gridId,
              serviceInput = Util.createServiceResponse(gridId);
              var myMask = new Ext.LoadMask({msg:"Please wait...",target: Ext.ComponentQuery.query('#grid')[0]});
              myMask.show();
            Ext.Ajax.request({
              url: Util.localGridService,
              method: 'POST',
              headers: Util.createRequestHeaders(),
              jsonData: {
                  getConfigurationAndDataRequestType: serviceInput
              },
              success: function(conn, response, options, eOpts) {
                    myMask.hide();
                  var data = Util.decodeJSON(conn.responseText);
                  store.setData(Util.formatGridData(data));
                  genericGrid.reconfigure(store, Util.formatGridMetaData(data));
              },
              failure: function(conn, response, options, eOpts) {
                 myMask.hide();
                  Util.showErrorMsg(conn.responseText);
              },
              scope: this
          });
          store.load();
      }

---

看看这个，在您的代码网格中，have itemId是batchGridfind by batchGrid，您的网格面板have别名是genericgridfind by genericgrid，因为它是组件的别名。然后只需更正它，在正确的名称上替换您的itemId，但最好使用目标所需的组件

更好

renderData: function(genericGrid) {
   var store = Ext.create("DummyApp.store.GenericGrid"),
       grid = genericGrid.down('#batchGrid') // get grid
       ...

   var myMask = new Ext.LoadMask({msg:"Please wait...", target: grid /*or genericGrid for gridpanel*/ });

renderData: function(genericGrid) {
   var store = Ext.create("DummyApp.store.GenericGrid"),
       grid = genericGrid.down('#batchGrid') // get grid
       ...

   var myMask = new Ext.LoadMask({msg:"Please wait...", target: grid /*or genericGrid for gridpanel*/ });