在showModalDialog函数打开的窗口中提交页面的时候重新打开新页面的解决办法

 

在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();        }