window.showModalDialog用法

window.showModalDialog用法

在实际的开发过程当中像window.showModalDialog弹出子窗体是非常常用的,今天写了一个DEMO
一。新建一个父窗体的页面ParentWeb.aspx

 1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ParentWeb.aspx.cs" Inherits="ParentWeb" %>
 2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3<html xmlns="http://www.w3.org/1999/xhtml" >
 4<head runat="server">
 5    <title>父窗体----学生信息录入</title>
 6    <script language="javascript">
 7    //打开新的子窗体
 8        function OpentChild()
 9        {
10            var parmName = document.getElementById("txtName").value;
11            var parmAge = document.getElementById("txtAge").value;
12            var arrArgs = new Array(parmName, parmAge);
13            var winSettings = "center:yes;resizable:no;dialogHeight:300px";        
14            var arrArgs = window.showModalDialog("ChildWeb.aspx",arrArgs,winSettings);
15            //下面的可以支持返回多个值[window.returnValue]
16            if(arrArgs==null)
17            {
18                alert("Nothing returned from ChildWeb!");
19            }

20            else
21            {
22                document.getElementById("txtName").value = arrArgs[0].toString();
23                document.getElementById("txtAge").value = arrArgs[1].toString();
                       // window.location.reload();  刷新父窗体
24            }

25            
26        }

27    </script>
28</head>
29<body>
30    <form id="frmParent" runat="server">
31    <div>
32        姓名:<input type="text" value="" id="txtName" /><br />
33        年龄:<input type="text" value="" id="txtAge" /><br />
34        <input id="btnSubmit" type="button"  value="Submit" onclick="return OpentChild();" />
35    </div>
36    </form>
37</body>
38</html>
39
二。新建一个子窗体ChildWeb.aspx

 1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ChildWeb.aspx.cs" Inherits="ChildWeb" %>
 2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3
 4<html xmlns="http://www.w3.org/1999/xhtml" >
 5<head runat="server">
 6    <title>子窗体----更新信息</title>
 7    <script language="javascript">
 8        //初始化子窗体
 9        function InitPage()
10        {
11            var myArgs = new Array();
12            myArgs = window.dialogArguments;
13            document.getElementById("txtName1").value = myArgs[0].toString();
14            document.getElementById("txtAge1").value = myArgs[1].toString();
15        }

16        //返回父窗体
17        function BackValue()
18        {         
19            var name = document.getElementById("txtName1").value;
20            var age = document.getElementById("txtAge1").value;  
21            var arrArgs = new Array(name, age);        
22            window.returnValue = arrArgs;
23            window.close();
24        }

25    </script>
26</head>
27<body onload="return InitPage();">
28    <form id="frmChild" runat="server">
29        <div>
30          姓名:<input type="text" value="" id="txtName1" /><br />
31          年龄:<input type="text" value="" id="txtAge1" /><br />
32        <input id="btnSubmit" type="button"  value="Submit" onclick="return BackValue();" />
33        </div>
34   </form>
35</body>
36</html>
37

阅读更多
想对作者说点什么? 我来说一句

window.showModalDialog的基本用法

2013年07月24日 4KB 下载

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭