在showModalDialog函数打开的窗口中提交页面的时候重新打开新页面的解决办法
业务需求是这样的:在一个列表页面(ListPage)中,点击按钮打开一个弹出窗口(EditPage),在弹出窗口中编辑信息后,点击“确定”保存信息,关闭弹出窗口同时重新刷新ListPage。
打开弹出窗口的JS:
function openPage() {
var seqId = document.getElementById("hidId").value;
if (seqId != "") {
var width = 650;
var height = 550;
var left = eval(screen.width - width) / 2;
var top = eval(screen.height - height) / 2;
var open_feature = "dialogWidth=" + width + "px;dialogHeight=" + height + "px;left=" + left + "px;top=" + top + "px,toolbar=0;menubar=0;resizable=0;location=0;status=0;";
var ret = window.showModalDialog(rootPath + "Home/Edit?seqId=" + seqId, window, open_feature);
if (ret==1) {
window.location.href = rootPath + "Home/Index"; //重新刷新列表页面
}
}
}
在EditPage页中,点击确定按钮的JS函数如下:
function Save() {
var theForm = document.forms[0];
if (theForm && (!theForm.onsubmit || (theForm.onsubmit() != false))) {
theForm.action = rootPath + "Home/Update";
theForm.submit();
}
}
对应的服务器端的代码:
[ValidateInput(false)]
[HttpPost]
public void Update (AddSupportHistoryModel addSupportHistoryModel)
{
//数据库的保存操作…
//保存成功后,关闭弹出窗口
Response.Write("<script type=\"text/javascript\">window.close();window.returnValue=1</script>");
Response.Flush();
Response.End();
}
出现的问题:点击“确定”按钮后,又弹出了一个新的空白窗口,并且先前弹出编辑窗口也没有关闭
解决办法:在弹出编辑窗口的head中添加以下代码,以上问题即可解决。
<base target="_self"></base>
另外,Google浏览器Chrome不支持直接对showModalDialog弹出窗体设置returnValue,替代方法是在弹出窗口中设置window.opener.returnValue。
以上代码经过修改后,如下:
打开弹出窗口的JS:
function openPage() {
var seqId = document.getElementById("hidId").value;
if (seqId != "") {
var width = 650;
var height = 550;
var left = eval(screen.width - width) / 2;
var top = eval(screen.height - height) / 2;
var open_feature = "dialogWidth=" + width + "px;dialogHeight=" + height + "px;left=" + left + "px;top=" + top + "px,toolbar=0;menubar=0;resizable=0;location=0;status=0;";
var ret = window.showModalDialog(rootPath + "Home/Edit?seqId=" + seqId, window, open_feature);
if (ret==undefined) {
ret = window.returnValue; //*****
}
if (ret==1) {
window.location.href = rootPath + "Home/Index"; //重新刷新列表页面
}
}
}
对应的服务器端的代码:
[ValidateInput(false)]
[HttpPost]
public void Update (AddSupportHistoryModel addSupportHistoryModel)
{
//数据库的保存操作…
//保存成功后,关闭弹出窗口
Response.Write("<script type=\"text/javascript\">window.close();window.returnValue=1;if(window.opener) { window.opener.returnValue=1;}</script>");
Response.Flush();
Response.End();
}