JQuery UI 对话框显示等待消息，直到处理 ajax 调用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15816740/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery UI dialog showing waiting message until ajax call is processed
提问by Zamboo
I think that all is in the title. When I started this I thought it will be a 5 minutes codes or a quick result when googling... But It's now three hours I'm on this:
我认为一切都在标题中。当我开始这个时，我认为这将是一个 5 分钟的代码或谷歌搜索时的快速结果......但现在是三个小时我在做这个：
Just show a dialog, with a "Please Wait..." message, while I'm performing an ajax call to retrieve some json result, and then show a "Result complete".
只需显示一个带有“请稍候...”消息的对话框，同时我正在执行 ajax 调用以检索一些 json 结果，然后显示“结果完成”。
$('#switchOff').live("click",function(){
$('#dialog').dialog({
modal:true,
open: function(){
// I would like to call myAjax function
//From here ?
// While my dialog is showing the Wait message...
},
complete: function(){
//close the dialog when fished
$('#dialog').dialog('close');
},
});
});
function ajaxCall() {
//my ajax call
}
回答by jmm
You should not use liveanymore. Use .oninstead. You are mixing up the dialog an ajax code. Here is an example of how I would do it.
你不应该再使用live了。使用.on来代替。您正在将对话框和 ajax 代码混在一起。这是我将如何做的一个例子。
Here is link to fiddle for demonstation
$('#switchOff').on("click", ajaxCall);
$("#loading").dialog({
hide: 'slide',
show: 'slide',
autoOpen: false
});
function ajaxCall() {
$.ajax({
url: '/echo/html/',
data: { html: '<p>JSON result</p>' , delay: 3},
method: 'post',
beforeSend: function(){
$("#loading").dialog('open').html("<p>Please Wait...</p>");
},
success: function(data) {
$('#loading').html("<p>Result Complete...</p>");
$('#ajaxResult').html(data);
}
});
}
回答by Mirko Cianfarani
Ok
好的
With this comment
有了这个评论
`As I described my problem, in fact I would like to first display the dialog: $("#myDialogBox").dialog();`
And after call the ajax..
The solution is:
解决办法是：
From the click on the button id="btn"
从点击按钮开始 id="btn"
$( "#btn_Deletepara" ).click(function() {
$( "#JQUERY'sDialog" ).dialog( "open" );
//Now you Call the ajax
});
Or
或者
$( "#JQUERY'sDialog" ).dialog({
Add your script for call ajax
