window.showModalDialog用法
在实际的开发过程当中像window.showModalDialog弹出子窗体是非常常用的,今天写了一个DEMO
一。新建一个父窗体的页面ParentWeb.aspx
一。新建一个父窗体的页面ParentWeb.aspx
Code
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="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
Code
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
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