繁忙的指标不显示在jquery对话框中

我有一个jQuery确认对话框。当用户按下OK时，我会执行一个需要几秒钟的Ajax调用。在此延迟期间，我希望在对话框中显示一个gif动画，以便用户知道我们正在处理他们的数据。但是，我似乎无法让gif出现在对话框中。繁忙的指标不显示在jquery对话框中

的HTML是：

<div id="dlgReleaseConfirmation" title="ConfirmRelease" style="display : none" > 
    <div id="release-in-progress" style="display:none"> 
      <img src="images/ajax-loader.gif" ></img> 
    </div> 
</div>

在js文件中的代码是：

 $("#dlgReleaseConfirmation").dialog({ 
     modal: true, 
     buttons: { 
      "Release": function() { 
       $("#release-in-progress").show();  // show the busy div - not working, blocked by dialog? 
       Release(); // release assays 
       loadTable();   // refresh datatable 
       $("#release-in-progress").hide();  // hide the busy div 
       $(this).dialog("close"); // close this dialog 
      }, 
      Cancel: function() { 
       $(this).dialog("close"); 
      } 
     }

有人能看到我在做什么错？

更新与解决方案。

亚历山大送我走了正确的道路。最重要的是，您必须执行异步Ajax调用，以便更新对话框以显示繁忙指示符。但是，如果只是这样做，那么问题就是代码将继续并关闭屏幕，同时ajax调用进行异步，从而为用户提供反馈。

为了解决这个问题，我添加了对ajaxStart（）和ajaxStop（）的调用，以便在异步Ajax调用正在进行的操作时隐藏和显示忙指示符。这里是工作的释放按钮处理程序代码：

"Release": function() { 
    $(this).ajaxStart(function() { 
     $("#release-in-progress").show(); 
    }); 
    $(this).ajaxStop(function() { 
     $("#release-in-progress").hide(); 
     $(this).dialog("close"); // close this dialog 
    }); 
    Release(); // release assays 
    loadTable();   // refresh datatable 
};

来源

2012-12-10 JerryKur

向我们展示你的CSS - 有可能出现它，但你不能看到它出现在对话框后面 – ManseUK

如果'loadTable（）'是异步的，你需要将'$（）。hide（）'移到complete回电话。什么是做'loadTable（）'？ – Alexander

你的按钮在给定的代码中？/ –

通过执行在loadTable()功能，直至请求完成和图像资源没有被加载你冻结执行的同步AJAX调用（async: false）。你需要使用异步调用来实现你想要的。

来源

2012-12-10 18:23:49 Alexander

目标是保持对话框的显示，直到数据被更新，表更新了新的值。切换到async：false不会实现此目的。例如，如果我切换到async：false，那么在实际数据更新之前（这是Release（）所做的），并且更新表以显示更新的效果（这是loadTable（）的作用）。 – JerryKur

@JerryKur，优秀。现在你知道你需要修理的所有东西 – Alexander

好的。所以这里是解决问题的代码。我使用了ajaxStart（）和ajaxStop（）。 “Release”：function（）{ $（this）.ajaxStart（function（）{ $（“＃release-in-progress”）。show（）; }）; （this）.ajaxStop（function（）{ $（“＃release-in-progress”）。hide（）; $（this）。对话框（ “亲密”）; //关闭此对话框 }）; ReleaseSelectedAssays（）; //释放分析 loadAssayTable（true）; – JerryKur

繁忙的指标不显示在jquery对话框中

回答

相关问题