我们知道在bs系统中如果想使用模态对话框,我们就要用window.showmodaldialog()这个方法, showmodaldialog()方法是用来创建一个显示html内容的模态对话框,这篇文档是用来对使用showmodaldialog()产生模态对话框进行各种应用时产生的问题的解决方法,这篇文档适用于asp,php,jsp等多种web技术，下面sample代码的我会用jsp。
注：这篇文档不涉及showmodaldialog()方法的说明
需要了解的请参阅 msdn文档，和kingerq网友的文档
http://dev.csdn.net/develop/article/44/44896.shtm
我们先写一个大家都很熟悉的showmodaldialog()最简单的使用－我们重写一下javascript中window的alert()方法.
我们先做的事情是新建一个文件alert.jsp
代码为:
<%@ page contenttype="text/html;charset=gbk" language="java" pageencoding="gbk" %>
<%
request.setcharacterencoding("gbk");
string msg=request.getparameter("msg");%>
<html xmlns:wsc>
<head>
<title>#您的系统名称#----------------------------</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script language=javascript>
function findenter()
{
if (event.keycode==13)
window.close();
}
</script>
</head>
<body onkeydown=javascript:findenter();>
<center>
<div style="overflow:auto;height:60px" align="center">
<%=msg%>
</div>
<input type=button value="确定" onclick="javascript:window.close();">
</center>
</body>
</html>
然后在你bs系统的unit.js文件中添加下面一个方法
function alert(msg)
{
var w=250;
var h=150;
posleft=(screen.width-w)/2
postop=(screen.height-h)/2
showmodaldialog("alert.jsp?msg=" + msg,"","status:no;dialogheight: " + h +"px; dialogwidth: " + w +"px;status:no;scroll:no;dialogtop: " + postop + "px; dialogleft: " + posleft + "px'");
}
这时候在引用了unit.js的页面中用 alert()方法时，出现的模式对话框就是我们自己定义的alert.jsp对话框了.用这种方法,我们可以在我们的系统中用showmodaldialog方法把 window.alert(), window.confirm(),window.prompt() 等ie的默认的提示框都重写一边,这样系统的ui风格就得到了统一,更加美观.
用showmodaldialog模拟alert是他最简单的应用,而大部分的bs系统中我们使用模态对话框的目的是有一个清单页面list.jsp,我们要双击list.jsp页面的一条记录时 弹出edit.jsp这个模态对话框,对这条记录进行编辑,这时候问题来了,在模态对话框的文件是不能重新载入的,就是说如果我们在edit.jsp文件里把<form>的数据post到save.jsp的时候，save.jsp不会在模态对话框里出现,而是弹出一个新的ie窗口,这显然是不能忍受的.这个问题的解决方法是这样的:
我们建立一个中间页面 比如openwindow.jsp
我们想在模态对话框中打开edit.jsp的时候调用
showmodaldialog打开openwindow.jsp页面,并把edit.jsp的文件名通过get方法传递给openwindow.jsp.
在openwindow.jsp页面里,建立一个iframe,载入传入的url地址edit.jsp.
这时候,不管在edit.jsp页面怎么refresh,怎么post,都会老老实实的呆在模态对话框里了
下面是实现的代码：
openwindow.jsp
<%@ page contenttype="text/html;charset=gbk" language="java" pageencoding="gbk" %>
<%
request.setcharacterencoding("gbk");
response.addheader("cache-control", "no-cache");
response.addheader("expires", "thu, 01 jan 1970 00:00:01 gmt");
string dlgurl=request.getparameter("url");
string dlgtitle=request.getparameter("title");
%>
<html>
<head>
<title><%=dlgtitle%></title>
</head>
<body leftmargin=0 topmargin=0 >
<iframe scroll=none width=100 frameborder=0 scrolling=no
height=100 src=<%=dlgurl%>></iframe>
</body>
</html>
在unit.js里添加函数
function showm(title,url,obj,w,h,obj)
{
var posleft=(screen.width-w)/2
var postop=(screen.height-h)/2
var url="openwindows.jsp?url=" + url + "&title=" + title;
var dlginf="status:no;dialogheight: " + h +"px; dialogwidth: " + w +"px;status:no;scroll:no;dialogtop: " + postop + "px; dialogleft: " + posleft + "px'";
var rv=showmodaldialog(url,obj,dlginf);
return rv;
}
恩,为了方便阅读,我把代码中的对特殊字符的处理和一些状态等待条去掉了,实际使用中可以依据自己使用的实际情况自己优化.
文中是我开发bs系统的对模态窗体使用的一点心得,希望能帮到大家,文中出现的错误,和有更优化的解决方法,请告知 nittystone@hotmail.com 谢谢
闽公网安备 35060202000074号