当应用程序执行 ajax 请求时，我想添加加载掩码

Posted 2023-02-25

【中文标题】当应用程序执行 ajax 请求时，我想添加加载掩码

【英文标题】：When ever app does ajax request i want to add load mask

【发布时间】：2013-03-28 09:08:15

【问题描述】：

在我的 sencha 应用程序中，，请求完成后我需要删除加载掩码。

我尝试了下面的代码，但它不适合我

var mask = new Ext.LoadMask(Ext.getBody(), msg:"Loading...");

   Ext.Ajax.on('beforerequest', function()
        mask.show();
   );

   Ext.Ajax.on('requestcomplete', function()
        mask.hide();
   );

【参考方案1】：

要显示负载掩码，您可以使用：

Ext.Viewport.mask( xtype: 'loadmask' );

并在您的 Ajax 请求的成功函数中隐藏加载掩码：

Ext.Viewport.unmask();

【参考方案2】：

很容易试试这些

Ext.Ajax.request(
    method:'GET',
    contentType:'application/json; charset=utf-8',
    dataType:'json',
    url:'http://..................Login',
    disableCaching: false,
    withCredentials: true,
    useDefaultXhrHeader: false,
    callbackKey: 'callback',

    params: 
        xyz:.......                                              
      ,
    success:function(response)
        console.log(response);
        var res = response.responseText;    
        var jsonarr = Ext.decode(response.responseText);
        console.log(jsonarr);
        var myres = jsonarr[0].Result;
        console.log(myres);
        Ext.Viewport.setMasked(false);  //hide the mask  loaded ...
       Ext.Viewport.setActiveItem(xtype:'dom_flightlist'); 
   //end of success fn

); //end of AJAX Request

在成功函数之后添加加载掩码..

【讨论】：

好的..成功后你将掩​​码设为假，那么你何时何地设置掩码..

在 ajax 请求之前你必须添加这些行 Ext.Viewport.setMasked(xtype: 'loadmask', message: 'Checking Availability for this flight Please Wait...', html:'');