showModalDialog模态对话框的使用

基本介绍：
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog() 方法用来创建一个显示HTML内容的模态对话框
window.showModelessDialog() 方法用来创建一个显示HTML内容的非模态对话框
使用方法：
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
参数说明：
sURL -- 必选参数，类型：字符串。用来指定对话框要显示的文档的URL
vArguments -- 可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过
window.dialogArguments来取得传递进来的参数
sFeatures -- 可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号;隔开
----------------
1. dialogHeight: 对话框高度，不小于100px
2. dialogWidth: 对话框宽度
3. dialogLeft: 离屏幕左的距离
4. dialogTop: 离屏幕上的距离
5. center: { yes | no | 1 | 0 } ：是否居中，默认yes，但仍可以指定高度和宽度
6. help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes
7. resizable: {yes | no | 1 | 0 } [IE5+]：是否可被改变大小。默认no
8. status: {yes | no | 1 | 0 } [IE5+]：是否显示状态栏。默认为yes[ Modeless]或no[Modal]
9. scroll: {yes | no | 1 | 0 | on | off }：是否显示滚动条。默认为yes
--下面几个属性是用在HTA(HTML Application)中的，在一般的网页中一般不使用
10. dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印预览时对话框是否隐藏。默认为no
11. edge:{ sunken | raised }：指明对话框的边框样式。默认为raised
12. unadorned:{ yes | no | 1 | 0 | on | off }：默认为no

基本用法：

1、传递参数（通过vArguments来进行传递的，类型不限制，对于字符串类型，最大为4096个字符，也可以传递对象）

2、返回参数（通过window.returnValue向打开对话框的窗口返回信息，可以为字符串数值或对象）

父文件(parent.html)：

<script language ="JavaScript">
<!--
    function testModal(){
        var obj = new Object();
        obj.name="sky";
        var returnStr = window.showModalDialog("modal.html",obj,"dialogWidth=580px;dialogHeight=300px");
        if(returnStr=="close"){
             //TODO  reload the part of price
        }
    }              
-->
</script>

子文件(modal.html)：

<script language ="JavaScript">
<!--
    var obj = window.dialogArguments;
    alert("name is ：" + obj.name);
    function closeModal(){
      window.returnValue="close";
      window.close();
    }
-->
</script>

3、在IE的modal窗口操作数据经过服务器传到页面会打开新的页面，而不是原来的modal窗口，解决办法如下

parent.jsp

<script language ="JavaScript">
<!--
    function doPriceModify(dealKbn,revDt){
      var partId = $("#partId").val();
      var url = "PartModify?partId="+partId;
      var winReturn = window.showModalDialog(url,"PartModify","dialogWidth:850px;dialogHeight:500px");
      if(winReturn=="close"){
        
      }
}
-->
</script>

PartAction.java

@Namespace("/")
@ParentPackage("struts-default")
@Results( { @Result(name = "success", location = "/WEB-INF/view/modalFrame.jsp")
           ,@Result(name = "login", location = "/WEB-INF/view/modal.jsp")})
public class PartAction extends ActionSupport {

    private static final long serialVersionUID = 1L;
    private String partId;
    
    @Action("partModify")
    public String partModify() throws Exception {
        return SUCCESS;
    }
    
    @Action("showPart")
    public String showPart() throws Exception {
        return LOGIN;
    }

    public String getPartId() {
        return partId;
    }
    public void setPersons(String partId) {
        this.partId = partId;
    }

}

modalFrame.jsp

<!doctype html>
<html>
<head>
<title>partModify</title>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<meta http-equiv=Content-Style-Type content=text/css>
</head>
<frameset rows="100%">
<frame src="showPart?partId=${partId}" name="partModify" scrolling="auto" noresize>
</frameset>
</html>

modal.jsp

<!doctype html>
<html>
<head>
<title>partModify</title>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<meta http-equiv=Content-Style-Type content=text/css>
<script language ="JavaScript">
<!--
    function closeModal(){
      window.returnValue="close";
      window.close();
    }
-->
</script>
</head>
<body>
<form action="modify" method="post" target="partModify">
</form>
</body>
</html>