038. asp.netWeb用户控件之六实现日期选择的用户控件

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

时间: 2024-10-17 01:00:33

038. asp.netWeb用户控件之六实现日期选择的用户控件的相关文章

原创控件代码共享--日期选择控件

思路:实现日期年月日的选择 1.可以设定年的起止年份 2.排除不正确日期选择的可能 3.使用javascript实现控制 4.使用Text属性方便获取设置日期值 ================================= 代码如下: using System; using System.Collections; using System.Collections.Specialized; using System.ComponentModel; using System.IO; using

ASP.NET--Web服务器端控件和Html控件

今天学习总结了一些相关概念和知识. 之前无论是做 单机的winform 还是 CS的winform 感觉,不到两年下来感觉还可以,虽然API有很多,但是还是比较熟悉基于WINDOWS消息机制的编程,但是现在网络硬件设施更新之快,BS 开发优势之大,不过需要的技术方面倒是得扩宽许多,JavaScript,CSS,Html都需要了解掌握,除webForm之外,对于现今主流的MVC更是需要学习. 概念: asp.net控件服务端控件  --> 响应服务端事件 HTML控件客户端控件   -- > 

ASP.NET AJAX入门系列(5):使用UpdatePanel控件(二) UpdatePanel

UpdatePanel可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加几个UpdatePanel控件和一个ScriptManager控件就可以自动实现局部更新.通过本文来学习一下UpdatePanel其他的一些使用方法(第二篇). 主要内容 1.用编程的方法控制UpdatePanel的更新 2.UpdatePanel的嵌套使用 3.同一页面上使用多个UpdatePan

ASP.NET AJAX入门系列(3):使用ScriptManagerProxy控件

在ASP.NET AJAX中,由于一个ASPX页面上只能有一个ScriptManager控件,所以在有母版页的情况下,如果需要在Master-Page和Content-Page中需要引入不同的脚本时,这就需要在Content-page中使用ScriptManagerProxy,而不是ScriptManager,ScriptManager 和 ScriptManagerProxy 是两个非常相似的控件. 主要内容 1.ScriptManagerProxy控件概述 2.简单示例 一.ScriptMa

ASP.NET AJAX入门系列(4):使用UpdatePanel控件(一)

UpdatePanel可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加几个UpdatePanel控件和一个ScriptManager控件就可以自动实现局部更新.通过本文来学习一下UpdatePanel简单的使用方法(第一篇). 主要内容 1.UpdatePanel控件概述 2.UpdatePanel工作原理 3.ContentTemplate属性 4.ContentT

2019-11-29-win10-uwp-如何判断一个控件在滚动条的里面是用户可见

原文:2019-11-29-win10-uwp-如何判断一个控件在滚动条的里面是用户可见 title author date CreateTime categories win10 uwp 如何判断一个控件在滚动条的里面是用户可见 lindexi 2019-11-29 08:42:36 +0800 2019-04-29 10:15:38 +0800 Win10 UWP 在 UWP 中如何知道一个元素是在滚动条的显示大小内用户可以看到这个控件?如果需要在控件在滚动条里面用户可以看到的时候触发某个事

ASP.NET日期选择控件

最近做一个项目的时候需要用到日期选择功能,本以为asp.net会有的,结果发现只有在winform下才可以使用这个datetimePicker,web下并没有提供这个功能.于是Google,网上有很多大牛用不同的方法解决了这个问题,其中有一个是出现率最高的,主要使用js实现,洋洋洒洒近300行的代码,自己实在看不懂,但是只要好用就好了,转载如下. calendar.js //日期选择 var gdCtrl = new Object(); var goSelectTag = new Array()

报表控件哪家强?.NET三大报表控件盘点

对于大型的综合程序,特别是企业级的程序解决方案,都会依赖报表来解决企业中的各种数据及可视化表现,从而让企业掌握运营中的各项数据汇 总..NET程序中著名的三大报表控件是:FastReport.Net.ActiveReports.Stimulsoft Reports.Net, 今天就细数各报表控件各自的优点,了解他们到底强到什么地方. FastReport.Net FastReport.Net是一款功能齐全的报表控件,含有丰富报表元素:文本.图像.线条.形状.语句.条形码.矩阵.表格.RTF.选择

WCF学习(二)对控件简单了解以及4个文本控件的简介

WPF基础控件 系统默认提供的基础控件: 文本控件介绍与用法 Label控件 label控件:一般用户描述性文字显示. 在Label控件使用时,一般给予用户提示.用法上没有什么很特殊的,label控件的值记住:不是Text 而是 Content属性. TextBlock控件 TextBlock控件,是只读的文本框,无法进行编辑,比较适合显示文本,该文本内容不允许编辑的情况. TextBlock进行设置值的属性是Text 支持直接赋值和数据绑定的方式赋值. TextBox TextBox是支持编辑