Web控件
你可能会担心,象 <asp:TextBox>这样的控件代表了一套需要你熟练运用的全新控件。不过,它们并不难学,因为它们在HTML中都有对应者。例如,对于一个很简单的文本框,在HTML 中,你是这样做的:
<input type=“text” value=“Your Name”></input>
而相应的Web 控件是这样的:
<asp:TextBox Text=“Your Name” runat=“server” />
在这两者中,你立刻就能注意到的是Web 控件通过代码“asp:”名称空间来识别,并且同在XML中一样,使用斜线来结束元素。你不是必须使用XML的格式,你也可以使用HTML格式,用一个分号来结束标记:</asp:TextBox>。但是你会发现,XML格式被用在许多代码举例中,并且代码字数也较简洁。名称空间必须要使用,它负责识别文本框TextBox 控件来自哪里。所有的标准Web控件都是 ASP名称空间的一部分。当编写自己的控件时,这一点变得很重要。
TextBox控件相对于标准的输入框好象没有多少优势,但是你应该考虑一下面的三个输入控件:
<input type=“text” ...>
<input type=“password” ...>
<textarea rows=“5" ...>
它们都是用于HTML输入的,但是并没有一致性。但是如果使用下面的,是不是更简单一些呢?
<asp:TextBox runat=“server”
...>
<asp:TextBox TextBoxMode=“Password”
...>
<asp:TextBox Rows=“5" ...>
你可以看到,一个简单控件包含了HTML中三个控件的功能,而且更易记忆、更易编码。
ASP.NET携带了5大类 Web控件:
• 与HTML相对应的固有控件
• 在页面上提供数据流的列表控件
•提供更丰富的UI(用户界面)内容和功能的Rich控件
• 完成各种表单验证的确认控件
• 为 WAP设备封装WML的移动控件
固有的服务器控件与 HTML控件相同,但是更加合理了,可提供更为一致的用途。这些控件包括LinkButton(链接按钮)、ImageButton(图象按钮)、HyperLink(超级链接)、TextBox(文本框)、CheckBox(复选框)、RadioButton(单选框)、DropDownList(下拉列表)、ListBox(列表框)、Image(图象)、Label(标签)、Panel(面板)、Table(表格)、TableRow(表格行)、TableCell(表格单元)。
列表控件包括Repeater(转发器)、DataList(数据列表)和DataGrid(数据栅格)。列表控件还包括RadioButtonList(单选框列表)和 CheckBoxList(复选框列表),这样就使创建单选框和复选框的列表变得简单。
Rich控件包括Calendar(日历)和AdRotator(广告旋转)。Calendar控件为低级的浏览器输出纯HTML,为高级浏览器输出DHTML(如 Internet Explorer 5.0)。AdRotator输出图象,它有内置的旋转代码。
确认控件包括RequiredFieldValidator(请求域确认)、 Compare Validator(比较确认)、RangeValidator(范围确认)、RegularExpressionValidator(规范表达确认)、CustomValidator(顾客确认)和ValidationSummary(确认摘要)。这些控件为开发人员在表单处理中建立确认提供了简单的途径。
有关移动控件的信息现在还没有发布,但是可以肯定它们有助于构造激活WAP的Web站点。
编写新的控件
你并不一定只局限于使用这些系统提供的控件,自己编写控件也相当简单。例如,如果想要一个控件来封装两个文本框(可能是名和姓的输入域),就可以这样来编写代码:
<asp:Panel runat=“server”>
<asp:Textbox id=“txtFirstName”
text=“First Name” runat=“server” />
<asp:Textbox id=“txtLastName”
text=“Last Name” runat=“server” />
</asp:Panel>
可以把这个代码保存在文件 Name.aspc (注意这个新扩展名)中,并将其作为一个Web表单控件来对待。接着,就可以向 Web表单中增加以下内容:
<%@ Register TagName=“NameControl” TagPrefix=“Foo” Src=“Name.aspc”
%>
<form>
<foo:NameControl runat=“Server”/>
</form>
这样你就可以很容易地创建可以再利用的控件了。这真实很美好 ;-) 你还可以直接在Visual
Basic或 C#中创建控件,允许它们成为其它控件的子类,并且呈现任何它们所要求的输出。因为控件是用名称空间来识别的,因此在控件之间应该是没有冲突的。实际上,控件甚至可以使用同一个名字,只要它们在不同的名称空间中就行。你会感觉到,这使得 ASP.NET非常具有扩展性,并且使编程环境变得越来越丰富。实际上有一个很大的提供丰富控件的第三方市场。
数据捆绑控件
新的Web控件之一是数据栅格DataGrid,这是用于显示成套数据的内置支持控件。为了从SQL生成的数据中产生一个 HTML表格,你只需要创建 ADO+对象,并执行指令来获取数据以作为栅格的数据源,比如下面的表4代码:
表 4
DaveSGrid1.aspx
<%@ Import Namespace=“System.Data.SQL”
%>
<html>
<script language=“VB” runat=“server”>
Sub Page_Load(Sender As Object, E As EventArgs)
Dim myCommand As SQLCommand
myCommand = New SQLCommand(Òselect * from products”,
ÒServer=localhost;
Database=AdvWorks; UID=sa”)
DataGrid1.DataSource = myCommand.Execute
DataGrid1.DataBind
End Sub
</script>
<body>
<ASP:DataGrid id=“DataGrid1" runat=“server” />
</body>
</html>
所需要做的就是将数据捆绑到数据栅格,然后就生成了一个整洁的HTML表格:
数据捆绑并不局限于来自数据库的数据,你还可以捆绑到hash表格、数组、其它服务器控件、页面的适当层,几乎什么都可以。如果默认的栏目不合适,还可以对其进行定制,让其显示你所感兴趣的部分:
<asp:DataGrid id=“DataGrid1"
AutoGenerateColumns=“false” runat=“server”>
<property name=“Columns”>
<asp:BoundColumn HeaderText=“
Name” DataField=“ProductName”/>
<asp:BoundColumn HeaderText=“Description”
DataField=“ProductDescription”/>
</property>
</asp:DataGrid>
使用 BoundColumn 控件选择一个简单的栏目,并指定栏的标题和这栏要捆绑到哪里。 AutoGenerate=“false” 属性负责确保栅格不会为你创建所有的栏目。如果想更复杂一些,也可以为这个栏目使用一个模板。
此前提到的Repeater和DataList控件也支持模板,这样就允许对控件的外观进行定制。Repeater实际上并没有外观,你必须要提供 UI,这就意味着必须要使用一个模板。相反,DataList控件是一个捆绑到数据的列表,有一个默认的外观和丰富的行为。为这两个控件添加模板的方法是一样的:
<asp:DataList is=“DataList1" runat=“server”>
<template name=“HeaderTemplate”>
Here”s your list of titles<br>
</template>
<template name=“ItemTemplate”>
<%# DataBinder.Eval(Container.DataItem, “Title”) %> <br>
</template>
</asp:DataList>
有了这个模板template,你就可以指定用哪些 HTML控件来组成数据捆绑控件的每一部分。有5个模板的名字可以与 DataList控件一起使用:HeaderTemplate用于控件的最顶端部分,ItemTemplate 用于各个项目,Alternating-Item-Template用于其它项目,SeparatorTemplate用于各个项目之间的区域,FooterTemplate用于控件的底部。
这个系统的好处在于:对于如何显示界面,有大量的控件可以使用。进一步使用产品列表,你就能用表7中的代码来生成下图所示的输出:
表 7
DaveSGrid2.aspx
<asp:DataList id=“MyDataList”
RepeatColumns=“2" runat=“server”>
<template name=“itemtemplate”>
<table cellpadding=10 style=“font:
10pt verdana”>
<tr>
<td width=1 bgcolor=“BD8672"/>
<td valign=“top”>
<img align=“top”
src=“<%# DataBinder.Eval(Container.DataItem,“ProductImageURL”) %>“ >
</td>
<td valign=“top”>
<b>Name: </b>
<%# DataBinder.Eval(Container.DataItem,”ProductName”) %><br>
<b>Description: </b>
<%# DataBinder.Eval(Container.DataItem,“ProductDescription”) %><br>
<b>Price: </b>
<%# DataBinder.Eval(Container.DataItem,”ProductPrice”, “$ {0}”) %>
</td>
</tr>
</table>
</template>
</asp:DataList>
这个代码相当简单,除了前面显示的 DataList代码外,不再需要更多的东西。代码里有一点值得注意,就是你可以规定出现的栏数,列表会自动处理栏的包装。这样就只需要一点格式化代码,Web页面就得到了极大的改进,而不再使用以前Web 页面上的传统栅格。