ajax 通话期间没有立即显示进度条

Question

我的要求：

1. 单击提交按钮并点击 Ajax 呼叫
2. 显示进度条
3. 一旦 Ajax 调用完成隐藏进度条
4. 显示 Extjs.Message.alert(Ajax 结果) 和 Ajax 结果

问题是当我单击提交按钮时，它执行下面的代码，但没有立即显示进度条，并且进度条与 Extjs 消息警报框同时隐藏

function submit() {

  jQuery("#myProgressBar").show();
  Ext.Message.Alert(doAjaxCall());
}



function doAjaxCall() {
  var ajaxResult = null;
  jQuery.ajax({
    url: someUrl,
    data: someData,

    success: function(result) {
      task.delay(1000);

      ajaxResult = result;
    }


  });
  return ajaxResult;
}

如果我使用下面的代码，那么只有它显示进度条，否则它不显示进度条

var task= new Ext.util.DelayedTask(function() {
  jQuery("#myProgressBar").hide();
});

和task.delay(1000); 在 Ajax 调用成功部分

Answer 1

尝试这个

function submit() {
  jQuery("#myProgressBar").show();
  doAjaxCall(aftersuccess);
}

function doAjaxCall(callback) {
  var ajaxResult = null;
  jQuery.ajax({
    url: someUrl,
    data: someData,

    success: function(result) {
     callback(result);
    }


  });
return result;
}

function  aftersuccess(data){
 jQuery("#myProgressBar").hide();
alert(data);
}