使用 asp的标准控件 与 验证控件 以及使用 C#Script 来完成 表单 的输入验证问题
文章目录
- 使用 asp的标准控件 与 验证控件 以及使用 C#Script 来完成 表单 的输入验证问题
- 一,题目
- 二, 涉及的知识
- 三,第一种解法:使用验证控件
- 四, 第二种解法:不使用验证控件,用label 标签代替
一,题目
- 请制作一个aspx页面,限定只能使用asp的标准控件与验证控件以及使用C#Script来完成Registration Form的输入验证问题(注意: 不能使用html tag与javascript)。若有错误,需以提醒使用者修改输入讯息,其规则如下图红字的部份(关于Country部份,请列举五个国家即可)。
二, 涉及的知识
1. asp标准控件
2.asp验证控件
学习资源来源 csdn博主文章:Asp.Net的六种验证控件
3.C#Script
4.正则表达式
学习资源 来源csdn博主文章:
- ValidationExpression 验证规则
- asp正则表达式大全
- 验证方法 ValidationExpression 正则表达式
三,第一种解法:使用验证控件
1.运行截图
加载页面如下
2.代码实现
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="homework4.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>1-Registration Form的输入验证问题</title>
<style >
.label_style {
width: 100px;
margin-bottom: 15px;
margin-right:15px;
text-align:right;
display: inline-block;
}
.div_content {
border: solid #000000; /*设置边框样式跟颜色*/
border-width: 1px; /*设置边框宽度*/
width: 630px; /*设置div宽度*/
height: 650px; /*设置div高度*/
margin: 0 auto; /*设置div居中*/
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="div_content">
<h2 style="font-weight:bold;margin:30px;">Registration Form</h2>
<asp:Label runat="server" class="label_style" >User id:</asp:Label>
<asp:TextBox ID="user_id" runat="server" Width="150px" ></asp:TextBox>
<asp:RequiredFieldValidator runat="server"
ControlToValidate="user_id"
ErrorMessage="Required "
ForeColor ="Red">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator
ControlToValidate="user_id"
ID="RegularExpressionValidator1"
ValidationExpression="\S{5,12}"
runat="server"
ErrorMessage="must be of length 5 to 12"
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style" >Password:</asp:Label>
<asp:TextBox ID="password_id" type="password" runat="server" Width="150px"></asp:TextBox>
<asp:RequiredFieldValidator runat="server"
ControlToValidate="password_id"
ErrorMessage="Required "
ForeColor ="Red">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator
ControlToValidate="password_id"
ValidationExpression="\S{7,12}"
runat="server"
ErrorMessage="must be of length 7 to 12"
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style" >Name:</asp:Label>
<asp:TextBox ID="name_id" runat="server" Width="350px"></asp:TextBox>
<asp:RequiredFieldValidator runat="server"
ControlToValidate="name_id"
ErrorMessage="Required "
ForeColor ="Red">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator
ControlToValidate="name_id"
ValidationExpression="^[a-zA-Z]+$"
runat="server"
ErrorMessage="alphabates only"
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style">Address:</asp:Label>
<asp:TextBox ID="address_id" runat="server" Width="350px"></asp:TextBox>
<br />
<asp:Label runat="server" class="label_style" >Country:</asp:Label>
<asp:DropDownList ID="country_id" runat="server" Width="200px" >
<asp:ListItem>(Please select a country)</asp:ListItem>
<asp:ListItem>China</asp:ListItem>
<asp:ListItem>US</asp:ListItem>
<asp:ListItem>France</asp:ListItem>
<asp:ListItem>Singapore</asp:ListItem>
<asp:ListItem>Chile</asp:ListItem>
</asp:DropDownList>
<asp:RegularExpressionValidator
ControlToValidate="country_id"
ValidationExpression="[{China,US,France,Singapore,Chile}]+$"
runat="server"
ErrorMessage="Please select a country"
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style">ZIP Code:</asp:Label>
<asp:TextBox ID="zip_code_id" runat="server" Width="150px"></asp:TextBox>
<asp:RequiredFieldValidator runat="server"
ControlToValidate="zip_code_id"
ErrorMessage="Required."
ForeColor ="Red">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator
ControlToValidate="zip_code_id"
ValidationExpression="^[0-9]+$"
runat="server"
ErrorMessage="Must be numeric only"
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style">Email:</asp:Label>
<asp:TextBox ID="email_id" runat="server" Width="350px"></asp:TextBox>
<asp:RequiredFieldValidator runat="server"
ControlToValidate="email_id"
ErrorMessage="Required."
ForeColor ="Red">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator
ControlToValidate="email_id"
ValidationExpression="^[a-zA-Z0-9]{1,}@[a-zA-Z0-9]{1,}.(com|net|org|edu|mil|cn|cc)$"
runat="server"
ErrorMessage="Must be a valid email."
ForeColor ="Red">
</asp:RegularExpressionValidator>
<br />
<asp:Label runat="server" class="label_style">sex:</asp:Label>
<asp:RadioButton id="male" runat="server" GroupName="male" Checked="true" Text="Male" />
<asp:RadioButton id="female" runat="server" GroupName="male" Text="FeMale"/>
<asp:CustomValidator
runat="server" ForeColor="Red"
ErrorMessage="Required."
OnServerValidate="radio_valid">
</asp:CustomValidator>
<br />
<asp:Label runat="server" class="label_style">Language:</asp:Label>
<asp:CheckBox id="CheckBox_English" Checked="true" runat="server" Text="English"/>
<asp:CheckBox id="CheckBox_non_English" runat="server" Text="Non English"/>
<asp:CustomValidator
id ="checkbox_warning"
runat="server" ForeColor="Red"
OnServerValidate="checkbox_valid"
ErrorMessage="Required." >
</asp:CustomValidator>
<br />
<asp:Label runat="server" class="label_style">About:</asp:Label>
<asp:TextBox ID="about_id" runat="server" Height="99px" Width="350px"></asp:TextBox>
<br />
<div style="text-align:center ;margin-top:15px;"> <asp:Button runat="server" Text="Submit" Height="38px" Width="93px" /></div>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace homework4
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Unnamed22_Click(object sender, EventArgs e)
{
}
protected void radio_valid(object source, ServerValidateEventArgs args)
{
if (male.Checked == false && female.Checked == false)
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
}
protected void checkbox_valid(object source, ServerValidateEventArgs args)
{
if (CheckBox_English.Checked == false && CheckBox_non_English.Checked == false)
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
}
}
}
四, 第二种解法:不使用验证控件,用label 标签代替
1.运行截图
2.代码实现
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="homework4.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>1-Registration Form的输入验证问题</title>
<style >
.label_style {
width: 100px;
margin-bottom: 15px;
margin-right:15px;
text-align:right;
display: inline-block;
}
.div_content {
border: solid #000000; /*设置边框样式跟颜色*/
border-width: 1px; /*设置边框宽度*/
width: 630px; /*设置div宽度*/
height: 580px; /*设置div高度*/
margin: 0 auto; /*设置div居中*/
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="div_content">
<h2 style="font-weight:bold;margin:30px;">Registration Form</h2>
<asp:Label runat="server" class="label_style" >User id:</asp:Label>
<asp:TextBox ID="user_id" runat="server" Width="150px" ></asp:TextBox>
<asp:Label ID="check_user_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style" >Password:</asp:Label>
<asp:TextBox ID="password_id" type="password" runat="server" Width="150px"></asp:TextBox>
<asp:Label ID="check_password_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style" >Name:</asp:Label>
<asp:TextBox ID="name_id" runat="server" Width="350px"></asp:TextBox>
<asp:Label ID="check_name_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style">Address:</asp:Label>
<asp:TextBox ID="address_id" runat="server" Width="350px"></asp:TextBox>
<br />
<asp:Label runat="server" class="label_style" >Country:</asp:Label>
<asp:DropDownList ID="country_id" runat="server" Width="200px" >
<asp:ListItem>(Please select a country)</asp:ListItem>
<asp:ListItem>China</asp:ListItem>
<asp:ListItem>US</asp:ListItem>
<asp:ListItem>France</asp:ListItem>
<asp:ListItem>Singapore</asp:ListItem>
<asp:ListItem>Chile</asp:ListItem>
</asp:DropDownList>
<asp:Label ID="check_country_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style">ZIP Code:</asp:Label>
<asp:TextBox ID="zip_code_id" runat="server" Width="150px"></asp:TextBox>
<asp:Label ID="check_zip_code_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style">Email:</asp:Label>
<asp:TextBox ID="email_id" runat="server" Width="350px"></asp:TextBox>
<asp:Label ID="check_email_id" runat="server" ></asp:Label>
<br />
<asp:Label runat="server" class="label_style">sex:</asp:Label>
<asp:RadioButton runat="server" GroupName="male" Text="Male" />
<asp:RadioButton runat="server" GroupName="male" Text="FeMale"/>
<br />
<asp:Label runat="server" class="label_style">Language:</asp:Label>
<asp:CheckBox id="English_CheckBox" runat="server" Text="English"/>
<asp:CheckBox id="Non_English_CheckBox" runat="server" Text="Non English"/>
<br />
<asp:Label runat="server" class="label_style">About:</asp:Label>
<asp:TextBox ID="about_id" runat="server" Height="99px" Width="350px"></asp:TextBox>
<br />
<div style="text-align:center ;margin-top:15px;"> <asp:Button runat="server" Text="Submit" Height="38px" Width="93px" OnClick="Unnamed22_Click"/></div>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace homework4
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
English_CheckBox.Checked = true;
}
protected void Unnamed22_Click(object sender, EventArgs e)
{
// 检验user id
if (user_id.Text.Length < 5 || user_id.Text.Length > 12)
{
check_user_id.ForeColor = System.Drawing.Color.Red;
check_user_id.Text = "必需的,必须是长度5到12";
user_id.Text = "";
}
else
{
check_user_id.Text = "";
}
// 检验password id
if (password_id.Text.Length < 7 || password_id.Text.Length > 12)
{
check_password_id.ForeColor = System.Drawing.Color.Red;
check_password_id.Text = "必需的,必须是长度7到12";
password_id.Text = "";
}
else
{
check_password_id.Text = "";
}
// 检验name id
Boolean check_name_flag = System.Text.RegularExpressions.Regex.IsMatch(name_id.Text, @"^[a-zA-Z]+$");
if (check_name_flag == false)
{
check_name_id.ForeColor = System.Drawing.Color.Red;
check_name_id.Text = "必需的,只能是字母";
name_id.Text = "";
}
else
check_name_id.Text = "";
//检验country id
if(country_id.Text== "(Please select a country)")
{
check_country_id.ForeColor = System.Drawing.Color.Red;
check_country_id.Text = "必需的,必须选择一个国家";
country_id.Text = "(Please select a country)";
}
else
check_country_id.Text = "";
// 检验zip code id
Boolean check_zip_code_flag = System.Text.RegularExpressions.Regex.IsMatch(zip_code_id.Text, @"^[0-9]+$");
if (check_zip_code_flag == false)
{
check_zip_code_id.ForeColor = System.Drawing.Color.Red;
check_zip_code_id.Text = "必需的,只能是数字";
zip_code_id.Text = "";
}
else
check_zip_code_id.Text = "";
//检验email id
Boolean check_email_flag = email_id.Text.Contains("@");
int i = email_id.Text.IndexOf("@");
if (email_id.Text.Length < i + 3 + 1)
{
check_email_id.ForeColor = System.Drawing.Color.Red;
check_email_id.Text = "必需的,要是有效的邮箱(有@,且@后必须有3字符)";
email_id.Text = "";
}
else
check_email_id.Text = "";
}
}
}