如何在AJAX JSON调用后关闭jQuery对话框 [英] How to close a jQuery dialog after an AJAX JSON call
问题描述
我正在使用ASP.NET MVC 4
,jQuery
和jQuery UI
.
我的视图上有一个对话框.当我单击一个按钮时,将弹出对话框,获取对话框中的值并将其发送给服务.该服务将执行所需的操作,如果成功,则将发送回空白消息,或者发送实际的错误消息.之后,我需要在客户端检查错误,关闭当前对话框,然后打开成功对话框或错误对话框.我不确定如何关闭当前对话框并显示另一个对话框.
I have a dialog on my view. When I click a button the dialog pops up, takes the values on the dialog and send its through to a service. The service does what it needs to do and will either send back a blank message if it is successful or the actual error message. After this I need to check the error on the client side, close the current dialog and open a success dialog or the error dialog. I'm not sure how to close the current dialog and to display another dialog.
我的按钮:
<button id="TestButton" type="button">Display pop up</button>
我的对话框:
<div id="confirmationDialog"></div>
<div id="successDialog"></div>
<div id="errorDialog">error dialog</div>
我的jQuery代码:
my jQuery code:
$('#TestButton').click(function () {
$('#confirmationDialog').dialog('open');
});
$('#errorDialog').dialog({
autoOpen: false,
modal: true,
resizable: false,
width: 500,
title: 'Add Rule Detail Error',
buttons: {
'Ok': function () {
$(this).dialog('close');
}
}
});
$('#confirmationDialog').dialog({
autoOpen: false,
modal: true,
resizable: false,
width: 330,
title: 'Add Rule Detail Confirmation',
open: function (event, ui) {
$(this).load('@Url.Action("AddRuleConfirmation")' +
'?systemCode=' + $('#SystemCode').val());
},
buttons: {
'Yes': function () {
var url = '@Url.Action("AddRuleConfirmationSubmit")';
var data = {
systemCode: $('#SystemCode').val()
};
$.getJSON(url, data, function (message) {
alert(message);
if (message == '') {
$(this).dialog('close');
}
else {
$(this).dialog('close');
$('#errorDialog').dialog('open');
}
});
},
'No': function () {
$(this).dialog('close');
}
}
});
我的动作方法:
public ActionResult AddRuleConfirmation(string systemCode)
{
DetailConfirmationViewModel viewModel = new DetailConfirmationViewModel()
{
SystemCode = systemCode
};
return PartialView("_AddRuleConfirmation", viewModel);
}
public ActionResult AddRuleConfirmationSubmit(string systemCode)
{
CreateRuleViewModel viewModel = new CreateRuleViewModel()
{
SystemCode = systemCode
};
ResCodeRuleAdd_Type result = ruleService.AddRule(viewModel);
string message = string.Empty;
if (result != ResCodeRuleAdd_Type.R00)
{
// Get the error message from resource file
message = ...
}
return Json(message, JsonRequestBehavior.AllowGet);
}
如何在获取JSON调用后关闭当前弹出窗口并打开另一个弹出窗口?
How do I close the current pop up after the get JSON call and open another?
推荐答案
您必须首先将对话框添加到页面中:将其放在当前文本之前:
You have to add the dialog to the page first: Put this prior to your current:
$('#errorDialog').dialog({
autoOpen: false,
modal: true,
resizable: false,
width: 330,
title: 'My Error Dialog'
});
//current code follows:
$('#confirmationDialog').dialog({
然后您所拥有的应该起作用.
Then what you have should work.
我想了一下,您可能需要在成功处理程序中修复$(this)
的范围.
I thought about this a bit, you probably need to fix the scope of the $(this)
inside the success handler.
更改为:
var myDialog = $('#confirmationDialog').dialog({
然后使用:
myDialog.dialog('close');
在该处理程序内部以关闭第一个对话框.
inside that handler to close the first dialog.
这篇关于如何在AJAX JSON调用后关闭jQuery对话框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!