Применение loadMask() только к панели сетки в extjs не работает

Я хочу применить маску нагрузки только к моей панели сетки, используя ее идентификатор, var myMask = new Ext.LoadMask({msg:"Пожалуйста, подождите...",target:Ext.ComponentQuery.query('#grid')[0 ]}); мояМаска.показать(); Но это, похоже, не работает. Тот же код работает для панели вкладок. Пожалуйста, предложите необходимые изменения для достижения маски загрузки только для панели сетки.

//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();
      }

person SWATI GUPTA    schedule 01.01.2015    source источник


Ответы (1)


Посмотрите на это, в вашей сетке кода itemId равен «batchGrid» (найдите по «#batchGrid»), ваша панель сетки имеет псевдоним «genericgrid» (найдите по «genericgrid», потому что это псевдоним компонента). Затем просто исправьте его, замените свой itemId на правильное имя, но лучше для этого используйте нужный компонент для цели

var myMask = new Ext.LoadMask({msg:"Please wait...",target: Ext.ComponentQuery.query('#batchGrid')[0]});

лучше

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*/ });

Скрипка

person Igor Semin    schedule 01.01.2015