【ASP.NET】服务器控件大演练与实例分析
asp服务器控件
简介(特点):保存视图状态,公共对象模型,简单,用户定制,创建浏览器特定HTML
- 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控件
代码如下:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) 2 { 3 dlbl.Text = "你选择的是" +DropDownList1.SelectedItem.Value +"."; 4 }
2)CheckBoxList控件
代码如下:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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控件
代码如下:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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控件
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<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" />
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<asp:Panel ID="Panel1" runat="server" BorderColor="Blue" BorderStyle="Solid" BorderWidth="4px" Height="45px" onload="Panel1_Load" Width="543px"> </asp:Panel>
panel.aspx.cs
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<asp:PlaceHolder ID="PlaceHolder1" runat="server" onload="PlaceHolder1_Load"> </asp:PlaceHolder>
placeholder.aspx.cs:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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 验证控件:
通过一个实例验证所有控件
前台代码:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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>用户名: <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>密 码: <asp:TextBox ID="txtpass" runat="server"/> 10 <asp:RequiredFieldValidator ID="rfvpwd" runat="server" ControlToValidate="txtpass" ForeColor="red" ErrorMessage="密码不能为空"></asp:RequiredFieldValidator> 11 </li> 12 <li>确认密码: <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 出生日期: <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 邮箱: <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>
后台代码:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
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控件:用于验证必填字段中是否输入了值。
用户名: <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控件:将用户输入的值和另一个控件值进行比较,或固定值比较。
确认密码: <asp:TextBox ID="txtrepass" runat="server"/>
<asp:CompareValidator ID="cvpwd" runat="server" ControlToCompare="txtpass"ForeColor="red"ControlToValidate="txtrepass" ErrorMessage="确认密码和密码必须相同"/>
3)RangeValidator控件:验证用户输入的值是否在指定范围
出生日期: <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控件:验证输入的值是否与正则表达式匹配
邮箱: <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" />
==》满足所有条件,运行正确结果:
- 自定义控件:
常见自定义服务器控件分4种:复合控件,验证控件,模板控件和数据绑定控件
作者:白宁超,工学硕士,现工作于四川省计算机研究院,研究方向是自然语言处理和机器学习。曾参与国家自然基金项目和四川省科技支撑计划等多个省级项目。著有《自然语言处理理论与实战》一书。 自然语言处理与机器学习技术交流群号:436303759 。
出处:http://www.cnblogs.com/baiboy/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。