第四章 Web服务器控件
4Web服务器控件
Borderstyle="Double"></ASP:BUTTON>
<ASP:BUTTON id="B7" Runat="Server" Text="Groove" BorderWidth="4" Borderstyle="Groove"></ASP:BUTTON> <ASP:BUTTON id="B8" Runat="Server" Text="Ridge" BorderWidth="4" Borderstyle="Ridge"></ASP:BUTTON> <ASP:BUTTON id="B9" Runat="Server" Text="Inset" BorderWidth="4" Borderstyle="Inset"></ASP:BUTTON> <ASP:BUTTON id="B10" Runat="Server" Text="Outset" BorderWidth="4" Borderstyle="Outset"></ASP:BUTTON> <p></p> <ASP:BUTTON id="B11" Runat="Server" Text="BorderColor" BorderWidth="4" BorderColor="Blue"></ASP:BUTTON> <ASP:BUTTON id="B12" Runat="Server" Text="BorderWidth" BorderWidth="4"></ASP:BUTTON> </form>
WEB服务器控件
WEB服务器控件编写一个WEB控件至少要包含三个元素:ASP:XXX指明是哪一类控件,ID指明控件的标识符,Ruant指明是在服务器端运行的。
如:<asp:TextBox ID="TextBox1"runat="server"></asp:TextBox><br/><asp:Label ID="Label1"runat="server"Text="Label"></asp:Label><br/><asp:Button ID="Button1"runat="server"Text="Button"/> </div>一、WEB服务器控件3、通过编程设置WEB服务器控件的属性如label1.Text=”您好”;TextBox1.TextMode=TextBoxMode.SingleLine;二、文字控件Label用于显示文字,其最常用的属性是Text,用于显示的文字内容。
TextBox控件用于输入文字信息,WEB用于文本输入工作的只有TextBox控件,通过设置控件的TextMode属性来区分文本,密码,多行文本输入方式。
注意:文本框内容是字符串类型,如果要做计算,需要作类型转换。
如convert.tosingle转成单精度,或single.parse()文字控件案例一(5_3):制作登录界面ID 属性设置Label1 Text=用户名Label2 Text=密码LblMessage Text=””protected void BtnRest_Click(object sender, EventArgs e){TxtUserName.Text = "";TxtPassWord.Text = "";LblMessage.Text = "";}protected void BtnSumit_Click(object sender, EventArgs e){if ((TxtUserName.Text.Trim() != "") && (TxtPassWord.Text.Trim() != "")){LblMessage.Text = "用户名:" + TxtUserName.Text + ":" + "密码" + TxtPassWord.Text;}else if (TxtUserName.Text.Trim() == ""){LblMessage.Text = "请输入用户名";}else{LblMessage.Text = "请输入密码";}}}文本控件案例二(5_1):显示日期protected void Page_Load(object sender, EventArgs e){DateTime now = DateTime.Now;this.lbltime1.Text = now.ToString();this.lbltime2.Text = now.ToShortDateString();this.lbltime3.Text = now.ToLongDateString();this.lbltime4.Text = now.ToLongTimeString();this.lbltime5.Text = now.ToShortTimeString();}文本控件案例三(5_2):显示金额protected void Button1_Click(object sender, EventArgs e){int money = Convert.ToInt32(TextBox1.Text);Label1.Text = money.ToString("C");Label2.Text = money.ToString("$#,###.00");}练习:制作页面,完成阶乘运算。
WEB服务器控件
this.lbltime4.Text = now.ToLongTimeString();
this.lbltime5.Text = now.ToShortTimeString();
}
文本控件案例三(5_2):显示金额
RadioButtonList1.DataBind();
CheckBoxList1.DataSource = team;
CheckBoxList1.DataBind();
}
}
protectedvoidButton1_Click(objectsender,EventArgse)
{
Label1.Text ="你最喜欢的球员是";
{
TxtUserName.Text ="";
TxtPassWord.Text ="";
LblMessage.Text ="";
}
protectedvoidBtnSumit_Click(objectsender,EventArgse)
{
if((TxtUserName.Text.Trim() !="") && (TxtPassWord.Text.Trim() !=""))
WEB服务器控件
编写一个WEB控件至少要包含三个元素:ASP:XXX指明是哪一类控件,ID指明控件的标识符,Ruant指明是在服务器端运行的。如:
<asp:TextBoxID="TextBox1"runat="server"></asp:TextBox><br/>
04 Web服务器控件讲解
_parent
将内容呈现在当前文档的父框架中。
_器的窗口中,并且取 消所有框架。 将内容呈现在设定的框架中。
13
2019年4月30日星期二
WEB程序设计
4.2.2 HtmlAnchor控件
OnServerClick方法:用于指定在单击HtmlAnchor 控件时引发的处理程序。用户可以为事件提供自定义处理程 序。
8
2019年4月30日星期二
WEB程序设计
(1)HTML服务器控件共有的常用属性 InnerHtml InnerText Value Attributes:
控件名称.Attributes("属性名")= "属性值" Disabled Visible
9
2019年4月30日星期二
WEB程序设计
【例4.1】本例通过InnerHtml与Innertext属性动态 设置<div>标记中显示的文本消息。
11
2019年4月30日星期二
WEB程序设计
4.2.2 HtmlAnchor控件
HtmlAnchor控件与HTML语言的超连接(<A>)标记对 应,可以使用它来创建页面中的超链接。
声明HtmlAnchor控件的语法是: <A Runat="Server" Id="…" Href="…" Target="…" Title="…" OnServerClick="…">超链接文字或图片</A> HtmlAnchor控件的主要属性和事件如下: Href属性:用来获取或设置在HtmlAnchor服务器控件中 指定的链接的URL目标。 Title属性:用来获取或设置当鼠标指针放在HtmlAnchor 控件上时所显示的工具提示文本。
第4章 Web服务器控件(新)
Image控件
Image控件是一种基本控件,可以使开发人员在Web窗体页 上显示图像,并用自己的代码管理这些图像。 Image控件的一般形式为:
<asp:Image id=„„控件名称“ Runat=“server” ImageUrl=“url” AlternateText=“string” /> Image控件的常用属性: ImageUrl属性表示设置图像控件显示的图片的路径。 AlternateText属性表示当图像控件中的图片无法显示时在显示位 置所要显示的文字。
根据页面的工作原理,即“一次编译,终 身运行”可知,控件经过定义后如不发生 更改将保持原样不变。 所有控件必须定义在.aspx(页面 文件)文件中。如果采用代隐藏技术设计的程序其事 件程序一般定义在代码文件(.cs,.vb)中。
4.2 常用基本Web控件
Web服务器控件可以自动检测客户端浏览器的类 型,产生一个或多个适当的HTML控件,并自动调 整成适合浏览器的输出。 Web服务器控件支持数据绑定技术,可以和数据 源连接,用来显示或修改数据源的数据。 每一个Web服务器控件都有一个<asp:>的前缀, 表示此控件为Web服务器控件。 格式如下: <asp:Control id="name" runat = "server" /> 每一个Web服务器控件具有id和runat属性,其含 义与HTML控件中相应的属性的含义一致。
面板控件常用属性
backimageurl属性表示要显示的背景图像.
RadioButton和RadioButtonList控件
允许用户从一个预定义的简短列表中选择一项,这些控件允 许定义任意数目带标签的单选按钮,并将它们水平或垂直的 排列。 RadioButton控件实现的是单个的单选按钮.
第4讲 WEB服务器控件应用
《WEB程序设计技术》
Web服务器控件使用方法详解
Label控件 Label控件 • 声明Label控件的语法如下: <asp:Label id="编程标识符" runat="server“ text=“文本内容”> </asp:Label> • 使用Label控件的Text属性可以获取或设置Label 控件的文本内容。
使用ListBox控件可以在Web窗体上创建单选或多选列表框。
声明ListBox控件的语法如下: <asp:ListBox id=“编程标识符” DataSource=“<% 数据绑定表
达式 %>”
DataTextField="数据源字段" DataValueField="数据源字段" AutoPostBack="True|False" Rows="列数" SelectionMode="Single|Multiple" runat="server"> <asp:ListItem value="value" selected="True|False">文本 </asp:ListItem> </a
《WEB程序设计技术》
Web服务器控件使用方法详解
RequiredFieldValidator 控件 RequiredFieldValidator 控件验证用户是否在选择列表控 件或TextBox控件中输入了数据值。 声明RequiredFieldValidator 控件的语法如下: <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="RequiredFieldValidator" Style="z-index: 124; left: 291px; position: absolute; top: 301px"> </asp:RequiredFieldValidator>
《ASP .NET基础教程》第四章: Web服务器控件
DataValueField
字符串
OnSelectedIndexChanged
当下拉列表中的选项发生改变时触发此事件
定义的事件名称
4.3 常用的Web服务器控件
HyperLink控件 HyperLink控件
HyperLink控件与 控件与HtmlAnchor控件类似,主要用于创建超链接。 控件类似,主要用于创建超链接。 控件与 控件类似
☆HyperLink控件属性☆ HyperLink控件属性 控件属性☆
属性名 NavigateUrl Text ImageUrl Target 描 述 用于设置要链接到的目标URL 用于设置HyperLink控件的文本标题 用于设置为HyperLink控件显示的图 像的路径 用于指定打开链接Web页面的窗口 取 值 字符串 字符串 字符串 _blank(新开窗口)/_self(相同框 架)/_parent(父框架)/_top(整页)
4.3 常用的Web服务器控件
DropDownList控件 DropDownList控件
DropDownList控件可用于创建单一选择的下拉列表。 控件可用于创建单一选择的下拉列表。 控件可用于创建单一选择的下拉列表
☆ DropDownList控件属性☆ DropDownList控件属性 控件属性☆
属性名 AutoPostBack 描 述 用于设置当用户更改下拉列表中的选定内容时是否 自动向服务器进行回发 用于设置绑定到下拉列表控件的数据源 用于设置绑定到下拉列表中各项的显示文本的数据 源字段 用于设置绑定到下拉列表中各项的值的数据源字段 取 值 True/False 字符串 字符串
DataSource DataTextField
第四章 Web服务器控件 Web服务器控件
第04章 Web服务器控件-3
Calendar控件 Calendar控件
Calendar控件就是日历控件,负责在页面上 Calendar控件就是日历控件,负责在页面上 显示日历并接受用户选择日期的操作。当需 要在网页中显示日期或需要用户输入或确认 日期时,就需要这样一个控件。 使用Calendar控件可以执行以下操作: 使用Calendar控件可以执行以下操作:
<asp:Calendar ID="Calendar1" runat="server" OnDayRender ="DayRender" ShowGridLines="True" /> void Page_Load(object sender, EventArgs e) { holidays[9, 10] = "教师节"; "教师节"; holidays[10, 1] = "国庆节"; "国庆节"; holidays[12, 25] = "圣诞节"; "圣诞节"; holidays[1, 1 ]= "元旦"; "元旦"; }
Calendar控件的外观属性 Calendar控件的外观属性
属性名 Font,ForeColor, Font,ForeColor,BackColor Height, Height,Width CellPadding, CellPadding,CellSpacing BorderColor,BorderStyle, BorderColor,BorderStyle, ShowGridLindes 说明 设置字体、文本和背景颜色 设置控件的整体尺寸 设置个别日的边距和间隔 设置边框和网格线的颜色、尺寸和 样式。
第四章 Web服务器控件
BorderColor属性
BorderWidth属性
BorderStyle属性
4.4 基本控件-Button控件
使用Button控件可为用户提供向服务器发送网页
的能力。该控件会在服务器代码中触发一个事件,
可以处理该事件来响应回发。
包括三种按钮控件,每种按钮控件在网 页上显示的方式都不同,如下表4-1所列:
网站部署在Web服务器上,人们可以通过浏览 器来访问这个站点。客户端请求一个静态的HTML 页面时,服务器找到对应的文件直接将其发送给用 户端浏览器;
请求页面时,服务器将在文件系统中找 到并读取对应的页面,然后将页面中的服务器控件 转换成浏览器可以读取的HTML标记和一些脚本代 码,再将转换后的结果页面发送给用户。
Label控件
提供一种以编程方式设置Web窗体页中文本的方法。希望 在运行时更改页面中的文本时就可以使用Label控件。 当希望显示的内容不可以被用户编辑时,可以使用Label 控件。如果只是希望显示静态文字,并且文字内容不需要 改变,建议使用HTML显示。 示例代码: <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
使用服务器控件,可以大幅减少开发
Web应用程序所需编写的代码量,提高开发效率 和Web应用程序的性能。
三种超链接方法
(1)<a href=“”>新浪</a> (2)<a id=“anchor1” runat=“server” ></a> (3)<asp:HyperLink ID=" anchor2" runat="server" >HyperLink</asp:HyperLink>
ASP.NET控件(一)
使用控制权转移控件
Button 控件
16
ImageButton 控件
Hyperlink 控件
选择控件
有四种类型的选择控件: CheckBox –为用户提供一种方法在 true/false、yes/no
或 on/off 选项之间切换 RadioButton - 用于只从选项列表中选择一个选项 DropdownList - 允许用户从预定义列表中选择一项 ListBox - 允许用户从预定义列表中选择一项或多项
28
有效性验证
用户注册时,输入了不合标准的信息,怎么办?
后台手写验证代码 页面回传,用户体验不好
使用javascript脚本进行验证 不安全,与浏览器相关
提供了验证控件
轻松实现用户输入的验证,且与用户浏览器无关 由在客户端或服务器中运行的验证代码执行 多种验证控件,验证数据更加简单方便
验证控件的使用方式
验证控件可以和在Web窗体页中处理的任意控件一起使用, 比如,HTML服务器控件或 Web服务器控件等。 添加——编程人员像添加其他服务器控件那样向窗体 添加验证控件。 关联——每个验证控件都会关联到一个或多个页面上 其他地方的输入控件(服务器控件)。 设置验证条件——验证控件便根据验证条件的要求测 试用户的输入值是否通过测试的属性。编程人员可以 使用自己的代码来测试页和单个控件的状态。如果检 测到状态无效,就略过更新。 显示错误——检测到错误的验证控件随后将生成显示 在页面上的错误信息。
HTML 标签
runat="server"
HTML 服务器控件
WEB服务器端控件是一个抽象对象模板,不仅 有一般表单类控件,还有ASP .NET的专用控件, 如日历控件等。
WEB服务器控件
4.11 CheckBoxList Web 服务器控件
1、格式 • <asp:CheckBoxList id="CheckBoxList1" • AutoPostBack="True|False" • CellPadding="Pixels" • DataSource='<% databindingexpression %>' • DataTextField="DataSourceField" • DataValueField="DataSourceField" • RepeatColumns="ColumnCount" • RepeatDirection="Vertical|Horizontal" • RepeatLayout="Flow|Table" • TextAlign="Right|Left" • OnSelectedIndexChanged="OnSelectedIndexChangedMethod" • runat="server"> • <asp:ListItem value="value" • selected="True|False"> • Text • </asp:ListItem> • </asp:CheckBoxList>
4.1 Web 服务器控件层次结构
• 图4-1显示了 System.Web.UI.WebControls 名称空间中控件的层次结构
4.2 Label Web 服务器控件
• 该控件允许您在页上显示静态文本并以编程方式对其进行操作。Label 控件类 似于 Literal 控件,不同之处在于 Label 允许您将样式属性应用于文本。
Web服务器控件
Web数据库技术教程
12
NET中的服务器控件
Web服务器控件(续)
<Script Language="VB" Runat="Server"> Sub Page_Load(Sender As Object, e As EventArgs)
Dim I As Short For I=1 To 8
Dim liA As New ListItem liA.Text="选项" & I.ToString rblA.Items.Add(liA) Next End Sub </Script> </Html>
2
NET中的服务器控件
Web服务器控件(续)
Label(标签) 用来在页面上显示信息。其语法为: <asp:Label id=“控件名称” Text=“显示的字符” runat="server"/>
Web数据库技术教程
3
NET中的服务器控件
Web服务器控件(续)
TextBox(文本框)
输入单行文本、多行文本或密码,默认为单行文本。 其语法为:
WEB数据库技术
NET中的服务器控件
Web服务器控件
Web服务器控件的属性
属性 BackColor BorderColor BorderWidth CssClass Enabled Font ForeColor Height Style TabIndex ToolTip Visible Width
<asp:TextBox id="控件名称"
TextMode="Single | Multiline | Password" Text="显示的字符" MaxLength="可输入字符数" Columns="多行文本的列数"
第4章 Web服务器控件
Bold,Italic,Strikeout, 布尔属性,用来设定是否应用给定的样式特性。 Underline,和Overline
4.1 Web服务器控件概述
8 .Web服务控件的事件
Web控件的事件的工作方式与传统的HTML标记的客户端事件工作方式 有所不同,这是因为HTML标记的客户端事件是在客户端引发和处理的,而 页面中的Web控件的事件是在客户端引发,在服务器端处理。 Web控件的事件模型:客户端捕捉到事件信息,然后通过HTTP POST 将事件信息传输到服务器,而且页框架必须解释该POST以确定所发生的事 件,然后在要处理该事件的服务器上调用代码中的相应方法。 所有的Web事件处理函数都包括两个参数:第1个参数表示引发事件的 对象,第2个参数表示包含该事件特定信息的事件对象。第2个参数通常是 EventArgs类型,或EventArgs类型的继承类型。 例如按钮的单击事件处理函数,代码如下: public void OnButton(Object Sender, CommandEventArgs e) { //单击 事件处理程序 //在此处添加处理程序 }
4.3 数据输入控件
4. RadioButtonList控件
RadioButtonList控件的常用属性和方法如下。 (1)RepeatColumns:获取或设置要在RadioButtonList控件中显 示的列数。 (2)RepeatDirection:获取或设置一个值,该值指示 RadioButtonList控件是垂直显示还是水平显示。 (3)RepeatLayout:获取或设置组内单选按钮的布局。 (4)SelectedIndex:获取或设置列表中选定项的最低序号索引。 (5)SelectedItem :获取列表控件中索引最小的选定项。 (6)SelectedValue:获取列表控件中选定项的值,或选择列表控 件中包含指定值的项。 (7)SelectedIndexChanged事件 :当列表控件的选定项在信息 发往服务器之间变化时发生。 (8)DataBinding事件 :当服务器控件绑定到数据源时发生。
第4章 服务器控件 《Web高级程序设计教程》电子教案
• 页框架为页中最常动态使用的HTML元素提供预定义的HTML服务器 控件:窗体、HTML <INPUT> 元素(文本框、复选框、“提交”按 钮等)、列表框(<SELECT>)、表、图像等等。这些预定义的 HTML服务器控件具有一般控件的基本属性,此外每个控件通常提 供自己的属性集和自己的事件。
第4章 服务器控件
• 除了提供HTML服务器控件的上述所有功能(不包括一对一映射到 HTML元素)外,Web服务器控件还提供以下功能:
• 功能丰富的对象模型,该模型具有类型安全编程功能。 • 自动浏览器检测。控件可以检测浏览器的功能,并为基本型和丰
富型(HTML4.0)浏览器创建适当的输出。 • 对于某些控件,可以使用模板自定义控件(Custom Control)外
• 即使验证控件已在客户端执行验证,页框架仍然在服务器上执行 它,以便可以在基于服务器的事件处理程序中测试有效性。此外, 它还有助于防止用户通过禁用或更改客户端脚本来避开验证。
第4章 服务器控件
4. 验证对象模型. • 您可以使用由单个验证控件和页公开的对象模型与验证控件交
互。每个验证控件都公开自己的IsValid属性,您可以测试以查看 是否通过该控件的验证测试。 • 在页级别,您可以访问另一个IsValid页属性,该属性是页上所 有验证控件的IsValid状态的概括。这一属性使您可以轻松作出快 速测试,查看您是否可以安全地继续进行处理。 • 该页还公开一个包含页上所有验证控件列表的Validators集合。 您可以依次通过这一集合来检查单个验证控件的状态。
第4章 服务器控件
4.3.1 一个页面
• 下面来看一个的页面,通过这个页面首先让读者对于 页面有一个初步的认识和了解。其源代码如下:
第四章 Web服务器控件
4.2.4 使用容器控件
例4-5利用Panel控件和LinkButton按钮控件来显示 和隐藏图片。 具体操作步骤如下: 1)在例4-1中创建的项目“example1”中再添加一 个新的窗体Panel1.aspx。 2)在Panel1.aspx的网页“设计”视图下,向该窗 体拖入一个Image控件(ImageUrl属性设为 “image1.jpg”,Width属性设置为“200px”);再 向该窗体拖入一个Panel控件(ID设置为PA1, HorizontalAlign属性分别为“Left”,ForeColor属性 设置为#FFC0C0);最后再拖入一个LinkButton控 件(ID设置为LB1,Text属性分别设为“隐藏图 片”)。
4.2.3 使用按钮控件
Button按钮控件是最常用的服务器控件之一,使 用该控件的目的是让用户根据内容作出选择或判 断,达到与用户交互的目的。 Button按钮控件的主要属性除了常见的属性之外 还有CauseValidation属性,它是用来控制该按钮 是否导致激发验证。 Button按钮控件的主要事件就是Click事件,就是 用户按下该按钮以后将会触发的事件。常常用来 完成文本的显示、表单的提交或选择的确认等。 下面来看一个例子。
表4-5 Panel控件的主要属性
属性 功能
BackImageUrl HorizontalAlign
用于在控件的背景中显示图像
用于指定子控件在面板内的水平对齐方式,取 值可以是Center、Justify、Left、NotSet和 Right
Wrap
用于确定当一行的长度超过面板的宽度时,控 件中的项是在下一行继续,还是在面板边缘 处截断
4.1 服务器控件概述
4.1.2 服务器控件的种类 2. Web服务器控件的分类 Web服务器控件拥有比HTML服务器控件更 多的功能,拥有类似XML的语法,而且使 用规则与Visual Basic控件的使用规则类似。 它不只提供文本与按钮等窗体类型的控件, 还提供了诸如DataGrid、DataList、 AdRotator、Calendar等特殊用途的控件。 返回
web服务器控件
《10.3W eb服务器控件》1. 目标概述[2分钟] (2)2. 回顾[5分钟] (2)3. 课程知识点讲解 (2)3.1. Web服务器控件简介[45分钟] (2)3.2. 文本控件[20分钟] (5)3.3. 控制权转移控件[45分钟] (6)3.4. 选择控件[20分钟] (7)3.5. 容器控件[15分钟] (8)3.6. 其他控件[25分钟] (8)4. 小结[3分钟] (8)5. 考核点 (9)6. 作业答案 (9)7. 扩展练习 (10)8. 学生问题汇总 (10)9. 教学后记 (10)本节目标⏹本节中将讲述如下主要内容:✧Web服务器控件简介✧文本控件✧控制权转移控件✧选择控件✧容器控件✧其他控件⏹通过教学使学生掌握WEB服务器控件及其应用。
本节重点⏹文本控件⏹控制权转移控件⏹选择控件⏹容器控件⏹其他控件本节难点⏹授课课时⏹4课时教法建议1.目标概述 [2分钟]本节主要讲述WEB服务器控件及其应用。
2.回顾 [5分钟]回顾上一节的相关知识。
3.课程知识点讲解3.1.Web服务器控件简介[45分钟]引入:主题:(1)Web服务器控件简述Web服务器控件具有以下特性:●功能丰富的对象模型,该模型具有类型安全编程功能。
由于Web服务器控件是框架全新封装提供的新控件,因此其具有严格的类型安全检查。
●自动浏览器检测。
Web服务器控件可以检测浏览器的功能,并为基本型和丰富型(HTML 4.0或以上) 浏览器创建适当的输出。
●对于某些控件,可以使用模板来自定义控件的外观。
●对于某些控件,可以指定控件的事件是立即发送到服务器,还是先缓存然后在提交窗体时引发。
●可将事件从嵌套控件(例如表中的按钮)传递到容器控件。
在设计时的“HTML”视图中,显示在页中的控件的格式如下:<asp:button attributes runat="server"/>(2)HTML服务器控件与W eb服务器控件的区别HTML服务器控件与Web服务器控件的区别:(3)Web服务器控件的公共属性1.System.Web.UI.WebControls.WebControl类的属性System.Web.UI.WebControls.WebControl 类是System.Web.UI.WebControls 命名空间中的所有控件的基类。
第4章 ASPNET服务器控件
案例教程 第1版
4
导航控件:这些控件被设计用于显示站点地图,
允许用户从一个网页导航到另一个网页,如 Menu控件、SiteMapPath控件等。
数据控件:用于显示大量数据的控件,如
第4章 服务器控件
案例教程
第1版
1
内容
服务器控件概述 HTML服务器控件 Web服务器控件 验证控件 用户控件
案例教程
第1版
2
4.1 服务器控件概述
服务器控件可以分为如下几类:
HTML服务器控件:提供了对标准
HTML元素的类封装,在HTML控件中 添加一个在服务器端运行的属性,即 可以由通用的客户端HTML控件转变 为服务器端HTML控件,使开发人员 可以对其进行编程。
案例教程
第1版
6
4.2 HTML服务器控件
HTML服务器控件概述
HTML服务器控件综合示例
案例教程
第1版
7
4.2.1 HTML服务器控件概述
1.HTML服务器控件的基本语法
传统的HTML元素是不能被服务器端直接使用的,但是通过将这 些HTML元素的功能进行服务器端的封装,开发人员就可以在服务器端使 用这些HTML元素。 在Visual Studio 2008集成开发环境中,从工具箱的“HTML”选项中拖放一 个Input(submit)按钮控件到设计页面上,切换到源视图,Input(submit)的 HTML源代码标记如下: <input id="Submit1" type="submit" value="submit" /> 在标记中直接添加runat="server",可以将HTML控件转化为HTML服务器 控件。设置为服务器控件后,源代码标记如下: <input id="Submit1" type="submit" value="submit" runat="server"/> id用来设置控件的名称,在一个程序中各控件的id均不相同,具有唯一性。 id属性允许以编程方式引用该控件。runat="server"表示作为服务器控件运 行。
4_Web服务器控件的使用(续)
实验4 Web服务器控件的使用(续)一、目的与要求掌握WEB服务器控件-CheckBox、CheckBoxList、DropDownList、ListBox、RadioButton、RadioButtonList、Panel、Table、BulletedList、FileUpLoad等控件的应用二、内容和步骤1.创建网站前的准备工作在E盘目录创建一个自己名字文件夹(如:mcmweb,即e:\mcmweb),在其中创建本次网站的根目录shiyan4(即e:\mcmweb\shiyan4),在shiyan4中创建一个空文件夹images。
创建名为shiyan4的网站,将default.aspx改名为radio-check.aspx。
2.设计radio-check.aspx页面(1)添加三个RadioButton控件,一个CheckBox控件和一个label控件。
各控件在页面中的位置如图1所示。
属性设置如表1所示。
图1表1 radio-check.aspx页面的属性设置(2)编写RadioButton1-Click事件(3)设置RadioButton2-Click事件和RadioButton3-Click事件的名字均为RadioButton1_CheckedChanged (4)保存文件,选择“调试” “开始执行(不调试)”执行程序,观察效果。
(5)将上述功能用RadioButtonList控件实现。
(6)添加一个CheckBoxList控件,一个label控件和一个Button控件。
各控件在页面中的位置如图2所示。
属性设置如表2所示。
图2(7)编写Button1-Click事件代码或者将foreach循环语句改成如下for语句:运行,观察效果,例如图3所示。
图33.增加一个新面页,名字为ListBox-DropDownList.aspx并进行如下设计(1)添加一个-DropDownList控件、两个Button控件Button1、Button2和一个标签控件label1。
第4章 ASPNET Web服务器控件
4.2.2 服务器控件的分类
HTML服务器控件
由System.Web.UI.HtmlControls类实现 对应传统的HTML元素,添加相应的ID属性和 runat="server"属性可以使之成为运行在服务器端的控件 具备相应的属性、事件和方法
Web服务器控件
由System.Web.UI.WebControls类实现 没有和HTML元素一一对应
4.3.3列表控件—— 4.3.3列表控件——DropDownList控件
4.3.2按钮控件 4.3.2按钮控件
3.5中包含3种用于向服务器端提交 表单的按钮控件,即Button、LinkButton和 ImageButton。这3种控件拥有同样的功能, 但每种控件的外观截然不同。
4.3.2按钮控件 4.3.2按钮控件 ——Button控件
Button控件是用来向服务器端提交表单的按钮。 Button控件的属性
4.2.4 控件属性和事件
控件事件
内部事件集——因为大多数Web窗体事件要求到服务器的往 返过程以进行处理,所以这些事件可能影响窗体的性能。 因此,服务器控件仅提供一组有限的内部事件。 Web服务器控件中的回发和非回发事件——在Web服务器控 件中,某些事件(通常是Click事件)会导致将窗体回发到 服务器。可以指定控件的AutoPostBack属性,进行页面实 时回发功能。
<asp: DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" Onselectedindexchanged="DropDownList1_SelectedIndexChanged"> <asp: ListItem>1</asp: ListItem> <asp: ListItem>2</asp: ListItem> <asp: ListItem>3</asp: ListItem> <asp: ListItem>4</asp: ListItem> </asp: DropDownList>
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
第四章 Web服务器控件
选择控件
CheckBox控件和CheckBoxList控件 【例4-2】创建一个可以选择歌手和歌曲的 页面 ;
第四章 Web服务器控件
选择控件
RadioButton控件和RadioButtonList控件 【例4-3】设计一个选择性别和学历的页面 ;
第四章 Web服务器控件
第四章 Web服务器控件
Web控件概述
Web控件是对HTML控件的扩充,它比HTML控件更 为抽象。Web控件包含在 System.Web.UI.WebControls基类; ID属性 Height属性 Width属性 AccessKey属性 TableIndex属性 Font属性Visible属性 Enabled属性 BackColor属性 BorderColor属性 BorderStyle属性 BorderWidth属性
第四章 Web服务器控件
其他控件
【例4-8】设计一个简单的登录注册页面。当登录成功时,显 示用户的一些基本信息,当登录失败时,显示一张图片;
控件
标准命令按钮(Button控件) 超链接按钮(LinkButton控件) 图形化按钮(ImageButton控件)
Label控件 TextBox控件
第四章 Web服务器控件
基本控件
【例4-1】创建一个用户登录的窗口,设置用户名 为admin,密码为123,当用户名和密码都正确时, 在窗体中显示“登录成功,恭喜你!”,否则在窗 体中显示“登录失败,再试一次!”
第四章 Web服务器控件
HTML控件概述
HTML控件包含在System.Web.UI.HtmlControls的基类中,由 于所有HTML控件的基类相同,故它们有一些共同的属性; Visible属性 Disabled属性 Attributes属性 Style属性 InnerHtml属性和InnerText属性 Value属性
程序设计
主讲教师:魏菊霞
第四章 Web服务器控件
HTML标记、HTML控件和Web控件
由HTML标记衍生而来,因此与HTML标记非常相 似,它们之间的最大区别是:前者在HTML标记 中添加了“runat=server”的标识属性,使HTML 服务器控件可以通过服务器端的代码来控制。而 Web服务器控件则是对HTML控件的扩充,它提 供了更多的功能控件,如日历控件等,所有的 Web服务器控件都包含在“<asp: ></asp: >” 标记中;
第四章 Web服务器控件
高级控件
Calendar控件 【例4-6】Calendar控件的使用。设计一个 页面,通过Calendar控件来选择某个日期的 年、月、日 ;
第四章 Web服务器控件
高级控件
AdRotator控件 【例4-7】设计一个广告条播放页面。在页 面中,将分别显示全球通、神州行、动感地 带的广告图片。当用户刷新页面时,系统将 随机显示一个广告图片和相应的文本和网 址;
列表控件
ListBox控件 【例4-4】设计一个寻找职位的页面,将找 到的职位添加到一个ListBox控件中显示 ;
第四章 Web服务器控件
列表控件
DropDownList控件 【例4-5】设计一个动态显示省份和城市的 页面,其中第一个下拉列表框是省份,第二 个下拉列表框根据省份显示不同的城市 ;