Question

我在一个窗口中有一个带有几个组合框的表单。

如果我显示窗口并立即关闭它（使用按钮关闭方法），有时我与服务器的连接很差，并且在组合框中加载数据的请求被中断。

响应是＆＃34;无法加载响应数据＆＃34;。

有时，当扩展组合框并且尚未加载存储时会发生同样的情况。

对于这些情况，在我的Application.js文件中，我有以下函数显示错误消息。

Ext.util.Observable.observe(Ext.data.Connection, {
requestexception: function (connection, response, options) {
      Ext.Ajax.abort(store.operation.request);
        Ext.Msg.show({
            title: 'Error!',
            msg: 'Message...',
            icon: Ext.Msg.ERROR,
            buttons: Ext.Msg.OK
        });
    }
  }
});

我试图阻止窗口关闭，直到请求完成并且数据被加载到组合框中。

我不想使用setTimeout（）。

也许在窗口中使用掩码并在请求完成时取消屏蔽ou禁用/启用关闭按钮。

我赞赏有关找到解决方案的建议。

编辑：

另一种可能更简单的方法是遍历表单的所有组合框，并检查每个组合框中是否有store.isLoading（）：如果是，它会显示一条消息，等待加载完成。< / p>

EDITED

如果表单只有一个组合框，则以下处理程序似乎可以解决问题：它会创建一个初始掩码并在加载存储后取消屏蔽它：

handler: function (btn) {
  var win = Ext.widget('winSearch', {
    animateTarget: this
  }).showBy(this, 'bl');

  win.getEl().mask('Loading...');    

  var store =  Ext.getStore('storeCombo1Id');    

  if(store.isLoading()){
     store.on('load', function() {
        win.getEl().unmask();
     });
  }else{
     win.getEl().unmask();
 }
}

问题是迭代几个组合框：我尝试了以下代码，但未成功（商店位于视图模型中）：

handler: function (btn) {
  var win = Ext.widget('winSearch', {
      animateTarget: this
  }).showBy(this, 'bl');

  win.getEl().mask('Loading...');


  // var store1 =  Ext.getStore('storeCombo1Id');
  // var store2 =  Ext.getStore('storeCombo2Id');
  // var store3 =  Ext.getStore('storeCombo3Id');
  // var allComboboxStores = [store1, store2, store3];

  var allComboboxStores = ['storeCombo1Id', 'storeCombo2Id', 'storeCombo3Id'];

  Ext.each(allComboboxStores, function(storeId) {
      var store = Ext.getStore(storeId);

      console.log(store); //console show 3 stores

      if(store.isLoading()){
        store.on('load', function() {
            win.getEl().unmask();
        });
      }else{
        win.getEl().unmask();
      }
   });    
}

这个解决方案的问题在于，如果加载其中一个组合框的存储，它会触发unmask方法，而不依赖于其他仍然要加载的组合框。

如何等到所有商店都装满？

EDITED

我尝试了不同类型的迭代和循环，以下解决方案似乎有效。

handler: function () {
var win = Ext.widget('mywindow', {
    animateTarget: this
}).showBy(this, 'bl');

win.getEl().mask('Loading...');

var allComboboxStores = ['storeCombo1Id', 'storeCombo2Id', 'storeCombo3Id'];

var indexStores = 0;
Ext.each(allComboboxStores, function(storeId) {
    var store = Ext.getStore(storeId);
     if(store){
        if(store.isLoading()){
            indexStores++
            store.on('load', function() {
                indexStores--;
                if (indexStores == 0){
                    win.getEl().unmask();
                }
            });
        }
        else if(!store.isLoading() && indexStores == 0){
             win.getEl().unmask();
        }
    }
 });  
}

我赞赏有关改进此解决方案的建议或其他建议。

Answer 1

如果jQuery不是问题...我建议使用Promises

描述：返回一个Promise对象，以观察绑定到排队或未排队的特定类型的所有动作何时结束。

等到ajax请求完成

1 个答案: