zoukankan      html  css  js  c++  java

  • 【ASP.NET】服务器控件大演练与实例分析

    asp服务器控件

    简介（特点）：保存视图状态，公共对象模型，简单，用户定制，创建浏览器特定HTML

    1.  web服务器控件：文本控件（2个）

        1） TextBox控件

    <asp:TextBox ID="TextBox5" runat="server" AutoPostBack="True"   BackColor="#CCCCCC" BorderColor="#FF0080" BorderStyle="Solid" BorderWidth="3px"  Font-Bold="True" Font-Overline="True" Font-Size="Larger" Font-Strikeout="False"  ForeColor="Red" Height="79px" MaxLength="12"  ontextchanged="TextBox5_TextChanged" ReadOnly="True" TextMode="MultiLine" ToolTip="这是一个文本控件" ViewStateMode="Enabled" Width="282px">文本控件属性事件</asp:TextBox>
          2） Label控件

    • 控制权转移控件（4个）1）Button 2）ImageButton3）LinkButton4）HyperLink

    2   选择控件，（4）

    1）DropDownList控件

    代码如下：

    View Code 
    1 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
2         {
3             dlbl.Text = "你选择的是" +DropDownList1.SelectedItem.Value +".";
4         }


    2）CheckBoxList控件

    代码如下：

    View Code 
     1 protected void CheckBoxList1_SelectedIndexChanged(object sender, EventArgs e)
 2         {
 3             string str = "";
 4             foreach (ListItem item in CheckBoxList1.Items)
 5             {
 6                 if (item.Selected)
 7                 {
 8                     str+=item.Value+"";
 9                 }
10             }
11             chlbl.Text = "你选择的是：" + str + ".";
12         }


    3）RadioButtonList控件

    代码如下：

    View Code 
     1 protected void RadioButtonList1_SelectedIndexChanged(object sender, EventArgs e)
 2         {
 3             string str = "";
 4             foreach (ListItem item in RadioButtonList1.Items)
 5             {
 6                 if (item.Selected)
 7                 {
 8                     str = item.Value + "";
 9                 }
10             }
11             rlbl.Text = "你选择的是：" + str + ".";
12         }


    4）ListBox控件

    View Code 
     <asp:ListBox ID="ListBox1"  runat="server" AutoPostBack="True" 
            onselectedindexchanged="ListBox1_SelectedIndexChanged" 
            SelectionMode="Multiple">
          <asp:ListItem>唱歌</asp:ListItem>
          <asp:ListItem>写代码</asp:ListItem>
          <asp:ListItem>游戏</asp:ListItem>
        </asp:ListBox>
        <br />
        <br />
        <asp:Label ID="lbrlbl" runat="server" />
    View Code 
     1 protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
 2         {
 3             string str = "";
 4             foreach (ListItem item in ListBox1.Items)
 5             {
 6                 if (item.Selected)
 7                 {
 8                     str += item.Value + "";
 9                 }
10             }
11             lbrlbl.Text = "你选择的是：" + str + ".";
12         }

    3  容器控件

    1）Panel控件

    panel.aspx:

    View Code 
    <asp:Panel ID="Panel1" runat="server" BorderColor="Blue" BorderStyle="Solid" 
            BorderWidth="4px" Height="45px" onload="Panel1_Load" Width="543px">
        </asp:Panel>

    panel.aspx.cs

    View Code 
    1 protected void Panel1_Load(object sender, EventArgs e)
2         {
3             TextBox text = new TextBox();
4             text.BorderColor = System.Drawing.Color.Red;
5             text.BorderStyle = BorderStyle.Solid;
6             text.BorderWidth = 2;
7             text.Text = "this is panel test page.";
8             this.Panel1.Controls.Add(text);
9         }


    2）PlaceHolder控件

    placeholder.aspx:

    View Code 
    <asp:PlaceHolder ID="PlaceHolder1" runat="server" onload="PlaceHolder1_Load">
        </asp:PlaceHolder>

    placeholder.aspx.cs:

    View Code 
    1 protected void PlaceHolder1_Load(object sender, EventArgs e)
2         {
3             TextBox text = new TextBox();
4             text.BorderColor = System.Drawing.Color.Red;
5             text.BorderStyle = BorderStyle.Solid;
6             text.BorderWidth = 2;
7             text.Text = "this is panel test page.";
8             this.PlaceHolder1.Controls.Add(text);
9         }

      4  HTML服务器控件：

    • HtmlFrom控件，

     <form id="form1" runat="server" method="post" action="目标页面的URL"></form>

    5 HtmlImage控件

    <img id="img1" src="图像URL" runat="server"/>

      6 验证控件：

    通过一个实例验证所有控件

    前台代码：

    View Code 
     1         <asp:Panel ID="Panel2" runat="server" Height="382px" style=" margin-left:300px" Width="440px" BackColor="#99CCFF" BorderColor="Red" BorderWidth="4px">
 2         <div id="div1">
 3         <ul style="font-size:small; vertical-align:middle;">
 4             <li  style=" font-size:large; text-align: center;">用户注册</li>
 5             <li>用户名：&nbsp;&nbsp;<asp:TextBox  ID="txtname" runat="server"/>
 6                 <asp:RequiredFieldValidator ID="rfvname" runat="server" ErrorMessage="用户名不能为空" ForeColor="red" ControlToValidate="txtname"></asp:RequiredFieldValidator>
 7                 <asp:CustomValidator ID="CustomValidator1" runat="server"  ControlToValidate="txtname" ForeColor="Red" ErrorMessage="必须包含a" onservervalidate="CustomValidator1_ServerValidate"></asp:CustomValidator>
 8             </li>
 9             <li>密 码：&nbsp;&nbsp; <asp:TextBox ID="txtpass" runat="server"/>
10                 <asp:RequiredFieldValidator ID="rfvpwd" runat="server"  ControlToValidate="txtpass" ForeColor="red" ErrorMessage="密码不能为空"></asp:RequiredFieldValidator>
11             </li>
12             <li>确认密码：&nbsp; <asp:TextBox ID="txtrepass" runat="server"/>
13                 <asp:CompareValidator ID="cvpwd" runat="server" ControlToCompare="txtpass" ForeColor="red" ControlToValidate="txtrepass"   ErrorMessage="确认密码和密码必须相同"></asp:CompareValidator>
14             </li>
15             <li>
16                 出生日期：&nbsp;&nbsp; <asp:TextBox ID="txtbirthday" runat="server" />
17                 <asp:CompareValidator ID="cvbri" runat="server"  ControlToValidate="txtbirthday" ForeColor="red" ErrorMessage="输入必须是日期" Operator="DataTypeCheck" Type="Date"></asp:CompareValidator>
18                 <asp:RangeValidator ID="rvBrithday" runat="server" ControlToValidate="txtbirthday" MaximumValue="2012/12/31" MinimumValue="2012/1/1" ForeColor="Red" ErrorMessage="日期超出范围"></asp:RangeValidator>
19             </li>
20             <li>
21                 邮箱：&nbsp;&nbsp;&nbsp; <asp:TextBox ID="txtem" runat="server" />
22                 <asp:RegularExpressionValidator ID="revEmail" runat="server"  ErrorMessage="请输入正确的E-mail地址！" ControlToValidate="txtem" ForeColor="Red"  ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
23            </li>
24             <li>性别：
25             <asp:RadioButtonList  ID="RadioButtonList2" runat="server" RepeatDirection="Horizontal">
26                  <asp:ListItem Selected="True">男</asp:ListItem>
27                  <asp:ListItem>女</asp:ListItem>
28             </asp:RadioButtonList>
29             </li>
30             <li>
31             爱好：
32                <asp:CheckBoxList  ID="CheckBoxList2" runat="server" RepeatDirection="Horizontal">
33                      <asp:ListItem>睡觉</asp:ListItem>
34                      <asp:ListItem>聊天</asp:ListItem>
35                      <asp:ListItem>写代码</asp:ListItem>
36                 </asp:CheckBoxList>
37             </li>
38             <li>
39             省份：
40             <asp:DropDownList ID="DropDownList2" runat="server">
41               <asp:ListItem >河南省</asp:ListItem>
42               <asp:ListItem >安徽省</asp:ListItem>
43               <asp:ListItem >河北省</asp:ListItem>
44             </asp:DropDownList>
45             </li>
46             <li>
47                 <asp:Button ID="Button4" runat="server" Text="注册" onclick="Button4_Click" />
48                 <asp:Button ID="Button5" runat="server" Text="取消" />
49             </li>
50             <li>
51             <asp:TextBox  TextMode="MultiLine" ID="zhucetxt" runat="server" Height="44px"  Width="378px"></asp:TextBox>
52              </li>
53              <li>
54                  <asp:ValidationSummary ID="ValidationSummary1" runat="server" />
55             </li>
56         </ul>
57         </div>
58         </asp:Panel>

    后台代码：

    View Code 
     1 protected void Button4_Click(object sender, EventArgs e)
 2         {
 3             string name = txtname.Text;
 4             string pass = txtpass.Text;
 5             string repass = txtrepass.Text;
 6             string birthday = txtbirthday.Text;
 7             if (repass != pass)
 8             {
 9                 Response.Write("<script>alert('密码必须相同！')</script>");
10             }
11             string sex=RadioButtonList2.SelectedItem.Value;
12             string str = "";
13             foreach(ListItem item in CheckBoxList2.Items)
14             {
15                 if(item.Selected)
16                 {
17                     str+=item.Value;
18                 }
19             }
20             string like = str;
21             string pro = DropDownList2.SelectedItem.Value;
22             zhucetxt.Text = "姓名：" + name + ""+ "密码：" + pass + "" +"生日："+birthday + "性别：" + sex + ""+ "爱好：" + like + ""+ "省份：" + pro;
23         }

      1）RequiredFiledValidator控件:用于验证必填字段中是否输入了值。

    用户名：&nbsp;&nbsp;<asp:TextBox  ID="txtname" runat="server"/>
    <asp:RequiredFieldValidator ID="rfvname" runat="server" ErrorMessage="用户名不能为空" ForeColor="red"ControlToValidate="txtname"/>               

    <asp:CustomValidator ID="CustomValidator1" runat="server"  ControlToValidate="txtname" ForeColor="Red" ErrorMessage="必须包含a" onservervalidate="CustomValidator1_ServerValidate"></asp:CustomValidator>             

     2）CompareValidator控件：将用户输入的值和另一个控件值进行比较，或固定值比较。

    确认密码：&nbsp; <asp:TextBox ID="txtrepass" runat="server"/>

     <asp:CompareValidator ID="cvpwd" runat="server" ControlToCompare="txtpass"ForeColor="red"ControlToValidate="txtrepass"   ErrorMessage="确认密码和密码必须相同"/>       

    3）RangeValidator控件：验证用户输入的值是否在指定范围

      出生日期：&nbsp;&nbsp; <asp:TextBox ID="txtbirthday" runat="server" />
     <asp:CompareValidator ID="cvbri" runat="server"  ControlToValidate="txtbirthday" ForeColor="red" ErrorMessage="输入必须是日期" Operator="DataTypeCheck" Type="Date"/> 

    <asp:RangeValidator ID="rvBrithday" runat="server" ControlToValidate="txtbirthday" MaximumValue="2012/12/31" MinimumValue="2012/1/1" ForeColor="Red" ErrorMessage="日期超出范围"/>

    4）RegularExpressionValidator控件：验证输入的值是否与正则表达式匹配

     邮箱：&nbsp;&nbsp;&nbsp; <asp:TextBox ID="txtem" runat="server" />
     <asp:RegularExpressionValidator ID="revEmail" runat="server"  ErrorMessage="请输入正确的E-mail地址！" ControlToValidate="txtem" ForeColor="Red"  ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"/>

    5）CustomValidator控件：用于创建自定义验证     

    用户名     <asp:TextBox  ID="txtname" runat="server"/>
     <asp:CustomValidator ID="CustomValidator1" runat="server"  ControlToValidate="txtname" ForeColor="Red" ErrorMessage="必须包含   a" onservervalidate="CustomValidator1_ServerValidate"/>    

    CustomValidator1_ServerValidate事件：

    protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
            {
                args.IsValid = args.Value.Contains("a");
            }

    6）ValidationSummar控件：用于概括所有错误提示

      <asp:ValidationSummary ID="ValidationSummary1" runat="server" />

    ==》满足所有条件，运行正确结果：

    1.  自定义控件：

    常见自定义服务器控件分4种：复合控件，验证控件，模板控件和数据绑定控件
  • 相关阅读:
    js点击按钮触发事件的方法(含函数的写法)
    操作文件
    克隆别人的仓库，提交到自己的远程仓库的方法
    时间戳变成 标准时间展示的方法
    还没看的书
    print 和 println的区别
    初学java记录
    java 的一个hellow word 代码解释
    eclipse 创建一个java项目 运行
    Eclipse环境配置
  • 原文地址：https://www.cnblogs.com/baiboy/p/asp_net.html
Copyright © 2011-2022 走看看