Version 3.0
HTML 控件和验证控件
第 四 章
2
回顾
? 在 ASP.NET 中有四组控件：
– 内部控件
– 列表控件
– 复杂控件
– 验证控件
? 同对象一样,Web 控件拥有方法和属性
并响应事件
3
目标
? 解释 HTML 控件
? 研究各种验证控件
? 解释代码隐藏
? 实现代码隐藏
4
HTML 服务器控件 2-1
? 页面开发人员以编程方式无法访问 HTML元素
? 要使这些元素可用程序访问, 必须指定对
HTML 元素进行分析并将其作为服务器控件
? 可以通过为 HTML 元素添加 runat="server" 属性
来完成
? 通过 HTML 元素唯一的 id 属性，可以用程序引
用该控件
5
HTML 服务器控 2-2
? HTML 服务器控件必须位于具有
runat="server" 属性的 <form> 标记中
? 通过 HtmlForm 控件，可以在网页中创建一
个用于元素的容器
? 通过 HtmlImage 控件, 可显示图像
? 通过 HtmlInputFile 控件，可以将文件上载
到服务器
6
HTMLForm控件
? 该控件映射到 <form> HTML 元素并允许为
Web 页中的元素创建一个容器
? 若要利用回发服务，则所有 Web 窗体控件
都必须嵌套在 HtmlForm 控件的格式正确的
开始和结束标记之间
? 不能在单个 Web 窗体页上包含多个
HtmlForm 控件
7
HtmlInputFile 控件演示
8
Web服务器控件优缺点
? Web 服务器控件与 HTML 服务器控件相比具
有以下优点
– Web 服务器控件的类型化对象模型编程简洁并且易于检
错
– 它们自动为下级 (HTML 3.2) 和上级 (HTML 4.0) 浏览器生
成正确的 HTML
– 它们可用于生成更复杂的服务器控件（例如 Calendar 和
DataGrid）
? Web 服务器控件的缺点
– 直接控制服务器控件如何呈现在发送给浏览器的页上的
能力较弱
9
HTML服务器控件优缺点
? 优点
– HTML 服务器控件能够同时在服务器和客户端编
程
– 使用 HTML 服务器控件将现有 HTML 或 ASP 页转
换为 Web 窗体页
? 缺点
– 所有值均为字符串，没有不具有类型安全性
– 可支持多种浏览器，但必须使用扩展样式，自
己对其进行编程
– 不能自动检测用于样式的浏览器功能
10
使用服务器控件设计页面建议
? Web 服务器控件
– 偏爱类似 Visual Basic 的编程模型
– 打算编写可能由 HTML 3.2 和 HTML 4.0 浏览器使用的 Web
窗体页
– 需要特定功能，例如日历
– 打算创建包含嵌套控件的应用程序并且需要在容器级别
捕获事件
? HTML 服务器控件
– 偏爱类似 HTML 的对象模型
– 打算使用现有 HTML 页，并需要迅速添加 Web 窗体功能
– 与客户端脚本交互
11
验证控件
限制空字段
比较两个字段
检查指定范围
使用表达式检查值
通过客户端或服务器端函数
检查值
在页面中列出所有控件
的验证错误
12
没有输
入值 嵌入错误 消息
<asp:requiredfieldvalidator controltovalidate="txtName"
display="static" errormessage="必须输入姓名！ "runat=server/>
<br> <br>
<center><asp:button id=btnSubmit text="提交 " runat=server
/></center>
RequiredFieldValidator
13
验证错误消息
动态显示
动态显示错误之前
动态显示错误之后
14
CompareValidator
<asp:comparevalidator controltovalidate="txtAge"
display="dynamic"
errormessage="年龄不能大于 58"
valuetocompare=58
type="Integer"
operator="LessThanEqual"
runat=server></asp:comparevalidator>
与静态值 58 进行比较
<asp:comparevalidator controltovalidate= "txtDoj"
display= "dynamic" errormessage = "出生日期不能大于或等于 入
学 日期 " Controltocompare="txtDob"
type="Date"
operator="GreaterThan" runat=server/> String,Integer、DateTime、
Currency,Double=,<,>,<=,>=,NotEqual
15
RangeValidator
<asp:rangevalidator
controltovalidate="txtAge"
type="Integer"
minimumvalue="18"
maximumvalue="58"
errormessage="您的年龄必须在 18-58 岁范围内 "
display="dynamic"
runat="server" >
</asp:rangevalidator>
指定控件值范围
16
RegularExpressionValidator2-1
Sign 含义
^ 指定检查开始处
$ 指定检查结束处
[ ] 检查输入的值是否与方括号中的字符之一相匹配
\w 允许输入任何值
\d{ }, \d” 指定输入的值是一个数字,{ } 表示已指定数据
类型的出现次数
+ 表明一个或多个元素将被添加到正在检查的表达式
17
RegularExpressionValidator2-2
<asp:regularexpressionvalidator
controltovalidate="txtEmailid"
display="static"
validationexpression="^[\w-]+@[\w-
]+\.(com|net|org|edu|mil)$" runat=server>
电子邮件 ID 格式不正确
</asp:RegularExpressionValidator>
验证电子邮件 ID
18
CustomValidator
<asp:customvalidator runat="server"
controltovalidate="txtGrade"
clientvalidationfunction="clientval"
onservervalidate="serverval"
display="static">
错误值
</asp:customvalidator>
客户端函数
19
ValidationSummary
<asp:validationsummary
id="ValSum"
headertext="所发现的错误是,"
displaymode="singleparagraph"
runat="server"/>
20
Page.IsValid 属性
<script language="C#" runat="server" >
void subbtn(Object Src,EventArgs E)
{ if (Page.IsValid == true)
{ lblMessage.Text = "页面有效！ "; }
}
</script>
21
Uplevel 和 Downlevel 浏览器
<%@ Page ClientTarget=DownLevel %>
禁用客户端验证
22
代码隐藏实现方法
? 编写 aspx页面文件
? 编写 aspx页面文件对应的代码文件
? 编译代码文件为 dll文件，并且将该 dll文件放
置在 bin目录下
? 注意：
– 页面指令
<%@ Page language="C#" Inherits="codebehind" %>
– 代码文件，页面文件用到的服务器控件的映射
public System.Web.UI.WebControls.Label lblMessage;
23
代码隐藏实例
24
代码隐藏的优点
? 实现代码重用
? 减少编写 aspx页面的复杂性
25
总结
? HTML服务器控件
? 数据验证控件
? 代码隐藏的实现
HTML 控件和验证控件
第 四 章
2
回顾
? 在 ASP.NET 中有四组控件：
– 内部控件
– 列表控件
– 复杂控件
– 验证控件
? 同对象一样,Web 控件拥有方法和属性
并响应事件
3
目标
? 解释 HTML 控件
? 研究各种验证控件
? 解释代码隐藏
? 实现代码隐藏
4
HTML 服务器控件 2-1
? 页面开发人员以编程方式无法访问 HTML元素
? 要使这些元素可用程序访问, 必须指定对
HTML 元素进行分析并将其作为服务器控件
? 可以通过为 HTML 元素添加 runat="server" 属性
来完成
? 通过 HTML 元素唯一的 id 属性，可以用程序引
用该控件
5
HTML 服务器控 2-2
? HTML 服务器控件必须位于具有
runat="server" 属性的 <form> 标记中
? 通过 HtmlForm 控件，可以在网页中创建一
个用于元素的容器
? 通过 HtmlImage 控件, 可显示图像
? 通过 HtmlInputFile 控件，可以将文件上载
到服务器
6
HTMLForm控件
? 该控件映射到 <form> HTML 元素并允许为
Web 页中的元素创建一个容器
? 若要利用回发服务，则所有 Web 窗体控件
都必须嵌套在 HtmlForm 控件的格式正确的
开始和结束标记之间
? 不能在单个 Web 窗体页上包含多个
HtmlForm 控件
7
HtmlInputFile 控件演示
8
Web服务器控件优缺点
? Web 服务器控件与 HTML 服务器控件相比具
有以下优点
– Web 服务器控件的类型化对象模型编程简洁并且易于检
错
– 它们自动为下级 (HTML 3.2) 和上级 (HTML 4.0) 浏览器生
成正确的 HTML
– 它们可用于生成更复杂的服务器控件（例如 Calendar 和
DataGrid）
? Web 服务器控件的缺点
– 直接控制服务器控件如何呈现在发送给浏览器的页上的
能力较弱
9
HTML服务器控件优缺点
? 优点
– HTML 服务器控件能够同时在服务器和客户端编
程
– 使用 HTML 服务器控件将现有 HTML 或 ASP 页转
换为 Web 窗体页
? 缺点
– 所有值均为字符串，没有不具有类型安全性
– 可支持多种浏览器，但必须使用扩展样式，自
己对其进行编程
– 不能自动检测用于样式的浏览器功能
10
使用服务器控件设计页面建议
? Web 服务器控件
– 偏爱类似 Visual Basic 的编程模型
– 打算编写可能由 HTML 3.2 和 HTML 4.0 浏览器使用的 Web
窗体页
– 需要特定功能，例如日历
– 打算创建包含嵌套控件的应用程序并且需要在容器级别
捕获事件
? HTML 服务器控件
– 偏爱类似 HTML 的对象模型
– 打算使用现有 HTML 页，并需要迅速添加 Web 窗体功能
– 与客户端脚本交互
11
验证控件
限制空字段
比较两个字段
检查指定范围
使用表达式检查值
通过客户端或服务器端函数
检查值
在页面中列出所有控件
的验证错误
12
没有输
入值 嵌入错误 消息
<asp:requiredfieldvalidator controltovalidate="txtName"
display="static" errormessage="必须输入姓名！ "runat=server/>
<br> <br>
<center><asp:button id=btnSubmit text="提交 " runat=server
/></center>
RequiredFieldValidator
13
验证错误消息
动态显示
动态显示错误之前
动态显示错误之后
14
CompareValidator
<asp:comparevalidator controltovalidate="txtAge"
display="dynamic"
errormessage="年龄不能大于 58"
valuetocompare=58
type="Integer"
operator="LessThanEqual"
runat=server></asp:comparevalidator>
与静态值 58 进行比较
<asp:comparevalidator controltovalidate= "txtDoj"
display= "dynamic" errormessage = "出生日期不能大于或等于 入
学 日期 " Controltocompare="txtDob"
type="Date"
operator="GreaterThan" runat=server/> String,Integer、DateTime、
Currency,Double=,<,>,<=,>=,NotEqual
15
RangeValidator
<asp:rangevalidator
controltovalidate="txtAge"
type="Integer"
minimumvalue="18"
maximumvalue="58"
errormessage="您的年龄必须在 18-58 岁范围内 "
display="dynamic"
runat="server" >
</asp:rangevalidator>
指定控件值范围
16
RegularExpressionValidator2-1
Sign 含义
^ 指定检查开始处
$ 指定检查结束处
[ ] 检查输入的值是否与方括号中的字符之一相匹配
\w 允许输入任何值
\d{ }, \d” 指定输入的值是一个数字,{ } 表示已指定数据
类型的出现次数
+ 表明一个或多个元素将被添加到正在检查的表达式
17
RegularExpressionValidator2-2
<asp:regularexpressionvalidator
controltovalidate="txtEmailid"
display="static"
validationexpression="^[\w-]+@[\w-
]+\.(com|net|org|edu|mil)$" runat=server>
电子邮件 ID 格式不正确
</asp:RegularExpressionValidator>
验证电子邮件 ID
18
CustomValidator
<asp:customvalidator runat="server"
controltovalidate="txtGrade"
clientvalidationfunction="clientval"
onservervalidate="serverval"
display="static">
错误值
</asp:customvalidator>
客户端函数
19
ValidationSummary
<asp:validationsummary
id="ValSum"
headertext="所发现的错误是,"
displaymode="singleparagraph"
runat="server"/>
20
Page.IsValid 属性
<script language="C#" runat="server" >
void subbtn(Object Src,EventArgs E)
{ if (Page.IsValid == true)
{ lblMessage.Text = "页面有效！ "; }
}
</script>
21
Uplevel 和 Downlevel 浏览器
<%@ Page ClientTarget=DownLevel %>
禁用客户端验证
22
代码隐藏实现方法
? 编写 aspx页面文件
? 编写 aspx页面文件对应的代码文件
? 编译代码文件为 dll文件，并且将该 dll文件放
置在 bin目录下
? 注意：
– 页面指令
<%@ Page language="C#" Inherits="codebehind" %>
– 代码文件，页面文件用到的服务器控件的映射
public System.Web.UI.WebControls.Label lblMessage;
23
代码隐藏实例
24
代码隐藏的优点
? 实现代码重用
? 减少编写 aspx页面的复杂性
25
总结
? HTML服务器控件
? 数据验证控件
? 代码隐藏的实现
