今天无聊研究了下怎么将子窗体的值传回父窗体.
于是,就想到在做毕业设计的时候想把那个查询功能的按日期查询做的更人性化点,具体思路是这样的:以前做毕业设计的时候是在后面直接写出日期格式,让别人按日期格式去填写, 现在我想让用户点文本框控件就弹出一个日历,然后用户在弹出的日历中选择日期,然后再返回给主窗体,副值给主窗体的文本框控件.
以下是实现代码:
主窗体:Default.aspx
在主窗体的HTML代码中的写两个脚本函数和一个input(text)类型的文本框控件,该控件是HTML控件,不是服务器控件如下:
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head runat ="server" >
< title > 无标题页 </ title >
< script language ="javascript" > ...
function isnum()
...{
//让文本框只能输入数字
if(event.keyCode<45 || event.keyCode>57)
...{
event.keyCode=0;
}
}
//下面两个函数才是今天这个功能要用的
function opendate()
...{
//弹出窗口,在弹出的窗口中有一个日历控件.
window.open('Default2.aspx','','scrollbars,height=300,width=418,left=300,top=300');
}
function refresh(a)
...{
//将子窗体选中的日期赋值给Text2
document.getElementById("Text2").value=a;
}
</ script >
</ head >
< body >
< form id ="form1" runat ="server" >
< div >
< input id ="Text1" type ="text" onkeypress ="isnum()" />
< asp:Button ID ="Button1" runat ="server" OnClick ="Button1_Click" Text ="Button" />
< br />
< input id ="Text2" type ="text" onmousedown ="opendate()" /></ div >
</ form >
</ body >
</ html >
在文本框控件上定义了一个onmousedown事件,当用户点击该文本框控件时,触发opendate()函数,弹出Default2.aspx子窗体
子窗体:Default2.aspx
子窗体中有一个日历控件和一个按钮控件,按钮控件用来提交日历控件选中的日期.
HTML代码如下:
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head runat ="server" >
< title > 无标题页 </ title >
</ head >
< body >
< form id ="form1" runat ="server" >
< div >
< asp:Calendar ID ="cld1" runat ="server" BackColor ="White" BorderColor ="#999999" CellPadding ="4"
DayNameFormat ="Shortest" Font-Names ="Verdana" Font-Size ="8pt" ForeColor ="Black"
Height ="180px" Width ="200px" >
< SelectedDayStyle BackColor ="#666666" Font-Bold ="True" ForeColor ="White" />
< TodayDayStyle BackColor ="#CCCCCC" ForeColor ="Black" />
< SelectorStyle BackColor ="#CCCCCC" />
< WeekendDayStyle BackColor ="#FFFFCC" />
< OtherMonthDayStyle ForeColor ="#808080" />
< NextPrevStyle VerticalAlign ="Bottom" />
< DayHeaderStyle BackColor ="#CCCCCC" Font-Bold ="True" Font-Size ="7pt" />
< TitleStyle BackColor ="#999999" BorderColor ="Black" Font-Bold ="True" />
</ asp:Calendar >
</ div >
< asp:Button ID ="Button1" runat ="server" OnClick ="Button1_Click" Text ="Button" />
</ form >
</ body >
</ html >
按钮的OnClick事件如下:
... {
string a = cld1.SelectedDate.ToShortDateString();
StringBuilder scriptString = new StringBuilder();
scriptString.Append("<script language = javascript>");
scriptString.Append("window.opener.refresh('"+a+"');");
scriptString.Append(" window.focus();");
scriptString.Append(" window.opener=null;");
scriptString.Append(" window.close(); ");
scriptString.Append("</" + "script>");
Response.Write(scriptString.ToString());
Response.Write(cld1.SelectedDate.ToShortDateString());
}
本次做这个功能的时候遇到了一个很"小"的问题,弄的我云里雾里的,就是调用父窗体的refresh(a)函数时,在子窗体传过去的值是string类型的,如:2007-6-21,就是那些小杠杠惹的祸.大家有没有注意到scriptString.Append("window.opener.refresh('"+a+"');");这句,如果你不写两个单引号将a强制转换为string类型,javascript会认为这是一个表达式,然后传到主窗体的时候,传过去的值就是:2007-6-21=1980.哎````真是不小心,害我调试了半天还不知道哪里出问题.