web用户控件的ascx代码:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="SelectDate.ascx.cs" Inherits="SelectDate" %>
<script type="text/javascript" src="js/jquery.1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.datepick.js"></script>
<script type="text/javascript" src="js/jquery.datepick-zh-CN.js"></script>
<script type="text/javascript">
$(function() {
$('#txtdate').datepick({ dateFormat: 'yyyy/mm/dd'});
});
</script>
<link href="js/redmond.datepick.css" rel="stylesheet" type="text/css" />
<%--将datepick框架应用到txtdate输入框中--%>
<input type="text" id="txtdate" name="tdate" style="width: 120px";
readonly="readonly"/> <%--该用户控件中包含了一个文本输入框, 该文本输入框通过JQuery和DatePick实现了日期选择, 但并未实现输入内容的合法性验证, 最简单的方式就是设置其readonly--%>

web用户控件的ascx.cs代码

public partial class SelectDate : System.Web.UI.UserControl
{
/// <summary>
/// 该方法用户返回用户选中的日期
/// </summary>
/// <returns></returns>
public string getvalue()
{
System.Collections.Specialized.NameValueCollection nv = new System.Collections.Specialized.NameValueCollection(System.Web.HttpContext.Current.Request.Form);
return nv.GetValues("tdate")[0].ToString();
} protected void Page_Load(object sender, EventArgs e)
{ }
}

Default.aspx页面代码:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register src="SelectDate.ascx" tagname="SelectDate" tagprefix="uc1" %>
<!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>
<style type="text/css">
.style1
{
width: 127px;
}
.style2
{
width: 100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<table align="center" cellpadding="0" cellspacing="0" style="width: 315px">
<tr>
<td class="style2">
用&nbsp; 户&nbsp; 名:</td>
<td class="style1">
<asp:TextBox ID="txtUserName" runat="server"></asp:TextBox>
</td>
<td >
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txtUserName" ErrorMessage="*"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="style2">
密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 码:</td>
<td class="style1">
<asp:TextBox ID="txtPwd" runat="server"></asp:TextBox>
</td>
<td >
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ControlToValidate="txtPwd" ErrorMessage="*"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="style2">
年&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 龄:</td>
<td class="style1">
<asp:TextBox ID="txtAge" runat="server"></asp:TextBox>
</td>
<td >
<asp:RangeValidator ID="RangeValidator1" runat="server"
ControlToValidate="txtAge" Display="Dynamic" ErrorMessage="年龄输入有误"
Font-Size="9pt" MaximumValue="100" MinimumValue="18" Type="Integer"></asp:RangeValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server"
ControlToValidate="txtAge" Display="Dynamic" ErrorMessage="*"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td class="style2">
性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 别:</td>
<td class="style1">
<asp:RadioButtonList ID="rdbSex" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Selected="True">男</asp:ListItem>
<asp:ListItem>女</asp:ListItem>
</asp:RadioButtonList>
</td>
<td >
&nbsp;</td>
</tr>
<tr>
<td class="style2">
生&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 日:</td>
<td class="style1">
<uc1:SelectDate ID="SelectDate1" runat="server" />
</td>
<td >
&nbsp;</td>
</tr>
<tr>
<td class="style2">
&nbsp;</td>
<td class="style1">
<asp:Button ID="Button2" runat="server" Text="注册" onclick="Button2_Click"
Width="119px" />
&nbsp;
</td>
<td >
&nbsp;</td>
</tr>
</table>
</form>
</body>
</html>

Default.aspx.cs页面代码:

protected void Button2_Click(object sender, EventArgs e)
{
if (SelectDate1.getvalue() != "")
{
string info ="用户名:"+txtUserName.Text + "/密码:" + txtPwd.Text + "/年龄:" + txtAge.Text + "/性别:" + rdbSex.SelectedValue + "/生日:" + SelectDate1.getvalue();
ClientScript.RegisterStartupScript(this.GetType(), "", "alert('" + info+ "');", true);
}
else
{
ClientScript.RegisterStartupScript(this.GetType(), "", "alert('请选择生日');", true);
}
}

程序中所用到的JS文件下载地址:

http://pan.baidu.com/s/1dFKavfz

05-11 11:31