第8章 Web窗体的数据控件
在了解了ADO.NET基础后,就可以使用ADO.NET提供的对象进行数据库开发和操作。ASP.NET还提供了一些Web窗体的数据控件,开发人员能够智能的配置与数据库的连接,而不需要手动的编写数据库连接。ASP.NET不仅提供了数据源控件,还提供了能够显示数据的控件,简化了数据显示的开发,开发人员只需要简单的修改模板就能够实现数据显示和分页。
8.1 数据源控件
数据源控件很像ADO.NET中的Connection对象,数据源控件用来配置数据源,当数据控件绑定数据源控件时,就能够通过数据库源控件来获取数据源中的数据并显示。而无需通过程序实现数据源代码的编写。
8.1.1 SQL数据源控件(SqlDataSource)
SqlDataSource控件代表一个通过ADO.NET连接到SQL数据库提供者的数据源控件。并且SqlDataSource能够与任何一种ADO.NET支持的数据库进行交互,这些数据库包括SQL Server、ACCESS、Oledb、Odbc以及Oracle。
SqlDataSource控件能够支持数据的检索、插入、更新、删除、排序等,以至于数据绑定控件可以在这些能力被允许的条件下自动的完成该功能,而不需要手动的代码实现。并且SqlDataSource控件所属的页面被打开时,SqlDataSource控件能够自动的打开数据库,执行SQL语句或存储过程,返回选定的数据,然后关闭连接。SqlDataSource控件强大的功能极大的简化了开发人员的开发,缩减了开发中的代码。但是SqlDataSource控件也有一些缺点,就是在性能上不太适应大型的开发,而对于中小型的开发,SqlDataSource控件已经足够了。
1.建立SqlDataSource控件
ASP.NET提供的SqlDataSource控件能够方便的添加到页面,当SqlDataSource控件被添加到ASP.NET页面中时,会生成ASP.NET标签,示例代码如下所示。
<asp:SqlDataSource ID="SqlDataSource1"runat="server"></asp:SqlDataSource>
切换到视图模式下,点击SqlDataSource控件会显式【配置数据源……】,单击【配置数据源……】连接时,系统能够智能的提供SqlDataSource控件配置向导,如图8-1所示。
在新建数据源后,开发人员可以选择是否保存在web.config数据源中以便应用程序进行全局配置,通常情况下选择保存。由于现在没有连接,单击【新建连接】按钮选择或创建一个数据源。单击后,系统会弹出对话框用于选择数据库文件类型,如图8-2所示。
图8-1 配置SqlDataSource控件 图8-2 选择数据源
当选择完后,配置信息就会显式在web.config中。当需要对用户控件进行维护时,可以直接修改web.config,而不需要修改每个页面的数据源控件,这样就方便了开发和维护。当选择了数据源后,需要对数据源的连接进行配置,这一步与ADO.NET中的Connection对象一样,就是要与数据库建立连接,当配置好连接后,可以单击【测试连接】按钮来测试是否连接成功,如图8-3和图8-4所示。
图8-3 添加连接 图8-4 测试连接
连接成功后,单击【确定】按钮,系统会自动添加连接,如图8-5所示。连接添加成功后,在web.config配置文件中,就有该连接的连接字串,代码如下所示。
<connectionStrings>
<add name="mytableConnectionString"connectionString="Data
Source=WIN-YXDGNGPG621;InitialCatalog=mytable; Integrated Security=True"
providerName="System.Data.SqlClient"/>
</connectionStrings>
数据源控件可以指定开发人员所需要使用的Select语句或存储过程,开发人员能够在配置Select语句窗口中进行Select语句的配置和生成,如果开发人员希望手动编写Select语句或其他语句,可以单击【指定自定义SQL语句或存储过程】按钮进行自定义配置,Select语句的配置和生成如图8-6所示。
图8-5 成功添加连接 图8-6 配置使用Select语句
对于开发人员,只需要勾选相应的字段,选择Where条件和Order By语句就可以配置一个Select语句。但是,通过选择只能够查询一个表,并实现简单的查询语。如果要实现复杂的SQL查询语句,可以单击【指定自定义SQL语句或存储过程】进行自定义SQL语句或存储过程的配置,如图8-7所示,开发人员选择了一个getdetail的存储过程作为数据源。
单击【下一步】按钮,就需要对相应的字段进行配置,这些字段就像ADO.NET中的参数化查询一样。在数据源控件中,也是通过@来表示参数化变量,当需要配置相应的字段,例如配置WHERE语句等就需要对参数进行配置,如图8-8所示。
图8-7 定义自定义语句或存储过程 图8-8 添加WHERE子句
添加WHERE子句时,SQL语句中的值可以选择默认值、控件、Cookie或者是Session等。当配置完成后,就可以测试查询,如果测试后显示的结果如预期一样,则可以单击完成,如图8-9所示。
图8-9 测试查询并完成
完成后,SqlDataSource控件标签代码如下所示。
<asp:SqlDataSourceID="SqlDataSource1" runat="server"
ConnectionString="<%$ConnectionStrings:mytableConnectionString %>"
SelectCommand="SELECT[TITLE], [ID] FROM [mynews]">
</asp:SqlDataSource>
2.配置SqlDataSource控件属性
SqlDataSource控件还包括一些可视化属性,这些属性包括删除查询(DeleteQuery)、插入查询(InsertQuery)、检索查询(SelectQuery)以及更新查询(UpdateQuery)。当需要使用可视化属性时,需选择【使用自定SQL语句或存储过程】复选框,在导航中可以使用查询生成器生成查询语句,如图8-10所示。
图8-10 自定义语句或存储过程
选择【查询生成器】按钮,系统会提示选择相应的表并通过相应的表来生成查询语句,如图8-11和图8-12所示。
图8-11 选择相应的表 图8-12 使用查询生成器
配置相应的查询语句后,SqlDataSource控件的HTML代码如下所示。
<asp:SqlDataSourceID="SqlDataSource1" runat="server"
ConnectionString="<%$ConnectionStrings:mytableConnectionString %>"
InsertCommand="INSERT INTO mynews(ID)VALUES ('control title')"
SelectCommand="SELECT [TITLE], [ID] FROM[mynews]">
</asp:SqlDataSource>
上述代码自动增加了一个InsertCommand并指定了Insert语句。开发人员可以为SqlDataSource控件指定四个命令参数:SelectCommand、UpdateCommand、DelectCommad和InsertCommand。每个都是数据源控件的单一属性,开发人员可以配置相应的语句指定Select、Update、Delete以及Insert方法。
SqlDataSource控件同时能够使用缓存来降低页面与数据库之间连接频率,这样可以避免开销很大的查询操作,以及建立连接和关闭连接操作。只要数据库是相对稳定不变的,则可以使用SqlDataSource控件的缓存属性(EnableCaching)来进行缓存。在默认情况下,缓存属性(EnableCaching)是关闭的,需要开发人员自行设置缓存属性。
8.1.2 Access数据源控件(AccessDataSource)
在上一章中介绍了如何使用ADO.NET中OleDb来连接和读取Access数据库。Access数据库是一种桌面级的数据库,当对应用程序性能,以及数据库性能要求不是很高,并且数据量不需很大时,可以考虑选择Access数据库。
SqlDataSource能够与任何一种ADO.NET支持的数据源进行交互,这些数据源包括SQL Server、Access、Oledb、Odbc以及Oracle。但是Access数据库有专门的数据源控件,就是AccessDataSource。AccessDataSource控件同配置SqlDataSource控件基本相同,如图8-13所示。
与SqlDataSource不同的是,SqlDataSource主要采用的是ConnectionString属性连接数据库,而Access则采用的是AccessDataSource方式连接数据库。因为Access数据库是以文件的形式存在于系统中的,所以主要采用DataFile属性直接以文件地址的方式进行连接。要连接Access数据库,则必须选择Access数据库文件,如图8-14所示。
图8-13 选择数据库 图8-14 选择Access文件
在选择了Access数据库文件后,单击【确定】按钮,系统就会为开发人员配置连接字串,在核对无误后,单击【下一步】按钮进入Select语句的配置。同SqlDataSource控件一样,同样能够配置Select语句或自定义存储过程,如图8-15所示。
同样8-15 配置Access数据库的Select语句
其他步骤与SqlDataSource相同,当创建完成后,AccessDataSource控件的HTML代码如下所示。
<asp:AccessDataSourceID="AccessDataSource1" runat="server"
DataFile="~/acc.mdb"
SelectCommand="SELECT [bh], [title] FROM[mytable]">
</asp:AccessDataSource>
当需要使用Access数据库,推荐将Access数据库文件保存在App_Data文件夹中。以保证数据库文件是私有的,因为ASP.NET不允许直接请求App_Data文件夹。
注意:AccessDataSource控件不支持访问受密码保护的Access数据库文件,如果需要访问受密码保护的Access数据库文件,则需要使用SqlDataSource控件。
8.1.3 目标数据源控件(ObjectDataSource)
大多数ASP.NET 数据源控件,如 SqlDataSource都是在两层应用程序层次结构中使用。在该层次结构中,表示层(ASP.NET 网页)可以与数据层(数据库和 XML 文件等)直接进行通信。但是,常用的应用程序设计原则是将表示层与业务逻辑相分离,而将业务逻辑封装在业务对象中。这些业务对象在表示层和数据层之间形成一层,从而生成一种三层应用程序结构。ObjectDataSource 控件通过提供一种将相关页上的数据控件绑定到中间层业务对象的方法,为三层结构提供支持。在不使用扩展代码的情况下,ObjectDataSource 使用中间层业务对象以声明方式对数据执行选择、插入、更新、删除、分页、排序、缓存和筛选操作。
也就是说,SqlDataSource是两层模型中使用的.页面通过直接访问数据库.。ObjectDataSource用于三层模型中,也就是将中间业务对象通过其访问数据库的。然后中间层业务对象再用在表示层中,例如在开发中使用的自定义控件。ObjectDataSource的业务对象是可以用检索或更新数据的业务对象,例如Bin或App_Code目录中定义的对象,选择业务对象如图8-16所示。
图8-16 选择业务对象
可以创建一个类库,并在ASP.NET网站中添加引用,这样就可以通过ObjectDataSource对象选择该类库中的方法,如图8-17和图8-18所示。
图8-17 添加类库 图8-18 添加引用
ObjectDataSource控件对象模型类似于SqlDataSource控件。ObjectDataSource公开一个TypeName属性,该属性指定要实例化来执行数据操作的对象类型,也就是类的名称。与SqlDataSource的命令属性类似,同样ObjectDataSource包括四个重要属性,这四个属性分别为SelectMethod、UpdateMethod、InsertMethod和DeleteMethod,分别用于指定要执行这些数据操作关联类型的方法。选择对象后,就可以配置SelectMethod、UpdateMethod、InsertMethod和DeleteMethod属性的方法。示例代码如下所示。
publicclass Class1 //创建类库
{
public string GetTitle() //创建方法
{
name = "title"; //变量赋值
return name; //返回name
}
public void InsertTitle() //创建方法
{
name = "insert"; //变量赋值
}
public string name; //创建共有变量name
}
ObjectDataSource控件可以使用Class1中的对象,如图8-19所示。
图8-19 定义数据方法
ObjectDataSource控件可以使开发人员将诸如GridView和DropDownList这样的用户界面控件绑定到一个中间层组件。能够无需编写任何代码即可绑定到一个组件,从而极大的简化用户界面。与其他的数据源控件相同,ObjectDataSource控件在运行时可以接受参数,并在参数集合中对参数进行管理。每一项数据操作都有一个相关的参数集合。对于选择操作,可以使用SelectParameters集合,对于更新操作,可以使用UpdateParameters集合,而给予InsertParameters、UpdateParameters、DeleteParameters集合,需要分别确定相应操作所需调用的方法。
8.1.4 LINQ数据源控件(LinqDataSource)
语言集成查询(LINQ)是一种查询语法,它可定义一组查询运算符,以便在任何基于.NET 的编程语言中以一种声明性的方式来表示遍历、筛选和投影操作。数据对象可以是内存中的数据集合,或者是表示数据库中数据的对象。无需为每个操作编写SQL命令,即可检索或修改数据。
使用LinqDataSource控件,开发人员可以通过在标记文本中设置属性从而在ASP.NET网页中使用 LINQ。LinqDataSource 控件使用LINQ to SQL来自动生成数据命令。LINQ数据源可以是LINQ数据库或数组等以集合形式表现的数据库,有关LINQ的知识会有专门的章节讲解,在这里使用数组作为数据源,示例代码如下所示。
public string[]arr={"1","2","3","4"}; //创建数组
在ASP.NET页面中使用LINQ数据源控件可以对LINQ数据源进行查询,LINQ数据源控件代码如下所示。
<asp:LinqDataSource ID="LinqDataSource1"runat="server">
</asp:LinqDataSource>
创建了LINQ数据源控件,同样单击【配置数据源……】按钮可以进行LINQ数据源控件的数据源配置,如图8-20所示。
当选择上下文对象后,需要配置数据选择,LINQ数据源控件同样支持Group和Where关键字,如图8-21所示。
图8-20 选择上下文对象 图8-21 配置数据选择
配置完成后,LINQ数据源控件HTML代码如下所示。
<asp:LinqDataSourceID="LinqDataSource1" runat="server"
ContextTypeName="ClassLibrary1.Class1"Select="new (Length, Chars)"
TableName="arr">
</asp:LinqDataSource>
当完成LINQ数据源控件(LinqDataSource)的配置后,就可以通过控件绑定LINQ数据源控件来获取LINQ数据库中的信息。LinqDataSource控件按以下顺序应用数据操作:
q Where:指定要返回的数据记录。
q Order By:排序。
q Group By:聚合共享值的数据记录。
q Order Groups By:对分组数据进行排序。
q Select:指定要返回的字段或属性。
q Auto-sort:按用户选定的属性对数据记录进行排序。
q Auto-page:检索用户选定的数据记录的子集。
LINQ是ASP.NET 3.5中增加的一种语言集成查询,该控件的高级属性和方法在ASP.NET 3.5与LINQ中会详细讲解。
8.1.5 Xml数据源控件(XmlDataSource)
Xml数据源控件可以让数据绑定控件轻易的连接到XML数据源。在只读方案下通常使用XmlDataSource控件显示分层XML数据,但同样可以使用该控件显示分层数据和表格数据。
1.建立XmlDataSource控件
与AccessDataScource相同的是,XmlDataSource控件同样使用DataFile属性指定XML文件并加载XML数据,如图8-22所示。数据源是XML文件,单击【浏览】按钮选择数据文件,如图8-23所示。
图8-22 配置数据源 图8-23 选择XML数据源
选择数据源后,单击确定并完成数据源的配置即可,配置完成数据源后,XmlDataSource控件的HTML代码如下所示。
<asp:XmlDataSource
ID="XmlDataSource1"runat="server" DataFile="~/xmldate.xml">
</asp:XmlDataSource>
上述代码指定了DataFile属性的所属的文件,当配置完成后,XmlDataSource控件就可以和数据绑定控件结合使用了。
2.XmlDataSource控件的使用
当配置完成XmlDataSource后,就可以和数据绑定控件结合使用。在使用数据绑定控件前,先配置XML数据文件,示例代码如下所示。
<?xml version="1.0"encoding="utf-8" ?>
<news>
<title>新闻标题1</title>
<time>2008</time>
<author>guojing</author>
<content>这是新闻正文</content>
<title>新闻标题2</title>
<time>2008</time>
<author>guojing</author>
<content>这是新闻正文</content>
</news>
上述代码配置了XML数据文件,配置完成后,可以通过数据绑定控件来访问,可以使用TreeView控件,示例代码如下所示。
<asp:TreeView ID="TreeView1"runat="server" DataSourceID="XmlDataSource1">
</asp:TreeView>
上述代码只能够显示XML数据文件中各个节点的名称,并不能显示各个节点的值,必须为显示的节点做配置。在控件侧边单击【TreeNode数据绑定】选项,并选择相应的列进行节点配置,如图8-24所示。
图8-24 选择列配置TextFiled
配置TextFiled后,各个节点的值会显示为XML数据中标签内的值,而XmlDataSource控件的HTML代码则会被系统自动替换,示例代码如下所示。
<asp:TreeView ID="TreeView1"runat="server" DataSourceID="XmlDataSource1"
ImageSet="Contacts"NodeIndent="10">
<ParentNodeStyleFont-Bold="True" ForeColor="#5555DD" />
<HoverNodeStyleFont-Underline="False" />
<SelectedNodeStyleFont-Underline="True" HorizontalPadding="0px"
VerticalPadding="0px" />
<DataBindings>
<asp:TreeNodeBindingDataMember="title" Text="title"TextField="#InnerText" Value="title" />
</DataBindings>
<NodeStyle Font-Names="Verdana"Font-Size="8pt"ForeColor="Black"
HorizontalPadding="5px"NodeSpacing="0px" VerticalPadding="0px" />
</asp:TreeView>
运行后,相应的节点则会显示为标签的相应的值,如图8-25所示。
图8-25 XmlDataSource数据绑定
XmlDataSource控件一般用于只读的数据方案。数据绑定控件显示XML数据,还可以通过XmlDataSource来编辑XML数据。但是当XmlDataSource控件加载时,必须使用DataFile属性加载,而不能从Data属性中指定的XML的字符串进行加载。
8.1.6 站点导航控件(SiteMapDataSource)
为了引导用户在站点的各个页面能够流畅跳转,需要在每个页面加入页面导航。在ASP的开发过程中,必须手动的为每个页面加入导航,这样不仅加大了开发的复杂度,也让代码的复用性变低。相对于手动加入导航更好的解决方法则是使用js在各个页面引用导航,但是一旦页面变得很多,可能会导致让js页面效率变低。而在ASP.ENT 2.0以后的版本,微软提供了导航控件让导航菜单的创建、自定义和维护变得更加的简单。
SiteMapDataSource控件包含来自站点地图的导航数据,这些数据包括有关网站中的页的信息,例如网站页面的标题、说明信息以及URL等。如果将导航数据存储在一个地方,则可以方便的在网站的导航菜单添加和删除项。站点地图提供程序中检索导航数据,然后将数据传递给可显示该数据的数据绑定控件,显示导航菜单。
如果需要使用SiteMapDataSource控件,用户必须在Web.sitemap文件中描述站点的结构,示例代码如下所示。
<?xml version="1.0"encoding="utf-8" ?>
<siteMapxmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="" title="根目录" description="根目录">
<siteMapNode url="SqlDataSource.aspx"title="SqlDataSource.aspx" description="SQL数据库" />
<siteMapNode url="AccessDataSource"title="AccessDataSource" description="Access数据库" />
<siteMapNode url="LinqDataSource"title="LinqDataSource" description="Linq" />
<siteMapNode url="ObjectDataSource"title="ObjectDataSource" description="Object" />
<siteMapNode url="XmlDataSource" title="XmlDataSource" description="Xml" />
</siteMapNode>
</siteMap>
上述代码描述了网站的目录结构,在文件中,必须有一个根为siteMapNode的元素作为siteMap元素的自己,并定义以下常用属性:
q title:为站点地图节点指定一个标题,该标题将显示为网页的连接文本。
q Url:为网页指定URL。支持相对或绝对路径。
q Description:为站点地图的节点添加描述,当用户鼠标移动到该栏目时,则会显示描述信息。
q StartFormCurrentNode:当设置为true时,则可以从该节点开始检索站点地图结构。
q StartingNodeOffset:当属性设置为2时可以检索当前地图结构。
SiteMapDataSource控件无需配置,拖放一个TreeView控件和一个SiteMapDataSource控件在页面,指定TreeView数据源即可,如图8-26所示。
图8-26 配置数据源
配置完成后,数据绑定控件会自动读取Web.sitmap文件并生成导航。当使用了SiteMapDataSource控件后,数据绑定控件就能够绑定SiteMapDataSource控件并自动读取相应的值并生成导航,当需要对导航进行修改时,只需要修改Web.sitemap即可,方便了站点导航功能的使用和维护。运行后如图8-27所示。
图8-27 SiteMapDataSource控件数据显示
8.2 重复列表控件(Repeater)
重复列表控件(Repeater)是一个可重复操作的控件。它能够通过使用模板显示一个数据源的内容,而且开发人员可以轻松的配置这些模板,Repeater控件包括如标题和页脚这样的数据,它可以遍历所有的数据选项并将其应用到模板中。
重复列表控件并不是从WebControl派生出来,重复列表控件可以直接操控HTML文件或者样式表来编写模板和控制属性。重复列表控件支持5种模板,用来显示相应的界面信息,这5种模板的功能如下所示:
q AlternatingItemTemplate:指定如何显示其他选项。
q ItemTemplate:指定如何显示选项。
q HeaderTemplate:建立如何显示标题。
q FooterTemplate:建立如何显示页脚。
q SeparatorTemplate:指定如何显示不同选项之间的分隔符。
在上面5种模板中,惟一需要使用的是ItemTemplate模板,其他的模板可以选用。示例代码如下所示。
<asp:Repeater ID="Repeater1"runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<%# Eval("title")%>
</ItemTemplate>
</asp:Repeater>
“<%#%>”符号之间的语句表示数据绑定表达式,可以直接使用数据源控件中查询出来字段。在Repeaater中间,使用ItemTemplate制作模板,在ItemTemplate模板中可以直接使用HMTL制作样式。在数据显示中,可以直接使用“<%#%>”绑定数据库中的列,例如当数据源控件中查询了一个title列时,则在Repeater控件中直接使用“<%#Eval(“title”)%>”方式显式title字段的值。
显示字段有几种方法,其中“<%#Eval(“字段名称”)%>”是最方便的显示字段的方法,能够方便的在模板中嵌入,其他方法还有使用“<%#DataBlinder.Eval(Container.DataItem,“字段名称”)%>”方式来绑定相关的列。示例代码如下所示。
<asp:Repeater ID="Repeater1"runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<divstyle="border-bottom:1px dashed #ccc; padding:5px 5px 5px 5px;">
<%#Eval("title")%>
</div>
</ItemTemplate>
</asp:Repeater>
上述代码自定义了一个HTML代码,增加了一个DIV标签,该标签设置了CSS属性border-bottom:1px dashed #ccc; padding:5px 5px 5px 5px;。Repeater控件能够自动的重复该模板。当数据库中的数据完毕后,则不再重复,运行结果如图8-28所示。
图8-28 Repeater控件
重复列表控件最常用的事件有ItemCommand、ItemCreated、ItemDataBound。当创建一个项或者一个项被绑定到数据源时,将触发ItemCreated和ItemDataBound事件。当重复列表控件中有按钮被激发时,会触发ItemCommand事件。
在ItemCommand中,为了自定义按钮控件相应事件,开发人员必须指定RepeaterCommandEventArgs参数获取CommandArgument、CommandName和CommandSource三个属性对应的值,示例代码如下所示。
<asp:Repeater ID="Repeater1"runat="server" DataSourceID="SqlDataSource1"
onitemcommand="Repeater1_ItemCommand">
<ItemTemplate>
<div style="border-bottom:1px dashed#ccc; padding:5px 5px 5px 5px;">
<%# Eval("title")%>
<asp:Button ID="Button1"runat="server" Text="按钮"
CommandArgument='<%#Eval("title")%>'/>
</div>
</ItemTemplate>
</asp:Repeater>
上述代码增加了一个按钮控件,并配置按钮控件的命令参数为数据库中的title的值。当单击按钮控件时,则会触发ItemCommand,示例代码如下所示。
protectedvoid Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
Label1.Text = "用户选择了" +e.CommandArgument.ToString(); //显式选择项
}
上述代码当指定了执行按钮控件触发的事件,运行结果如图8-29和图8-30所示。
图8-29 ItemCommand事件 图8-30 用户选择单击后
Repeat控件需要一定的HTML知识才能显示数据库的相应信息,虽然增加了一定的复杂度,但是却增加了灵活性。Repeat控件能够按照用户的想法显示不同的样式,让数据显示更加丰富。
8.3 数据列表控件(DataList)
DataList控件支持各种不同的模板的样式,通过为DataList指定不同的样式,可以自定义DataList控件的外观。与Repeater控件相同的是,DataList控件同样也支持自定义HTML,但是DataList控件具备Repeater控件不具有的特性,DataList控件常用属性如下所示。
q AltermatingItemStyle:编写交替行的样式。
q EditItemStyle:正在编辑的项的样式。
q FooterStyle:列表结尾处的脚注的样式。
q HeaderStyle:列表头部的标头的样式。
q ItemStyle:单个项的样式。
q SelectedItemStyle:选定项的样式。
q SeparatorStyle:各项之间分隔符的样式。
通过修改DataList控件的相应的属性,能够实现复杂的HTML样式而不需要通过变成实现。而DataList控件能够套用自定义格式实现更多的效果,如图8-31所示。
通过属性生成器,同样可以通过勾选相应的项目来生成属性,这些属性能够极大的方便开发人员制作DataList控件的界面样式,如图8-32所示。
图8-31 自动套用格式 图8-32 属性生成器
DataList控件经常在开发中使用,DataList控件不仅能够支持Repeater控件中的ItemCommand、ItemCreated、ItemDataBound事件,还支持更多的服务器事件。对项中的按钮进行操作,如果按钮的CommandName属性为“edit”,则该按钮则可以引发EditorCommand事件,同样也可以配置不同的CommandName属性来实现不同的操作。编辑DataList控件,并编辑相应的HTML代码,让DataList控件包括按钮,并为按钮配置相应的CommandName属性,示例代码如下所示。
<asp:DataList ID="DataList1" runat="server"BackColor="White"
BorderColor="#E7E7FF" BorderStyle="None"BorderWidth="1px" CellPadding="3"
DataKeyField="ID" DataSourceID="SqlDataSource1"Font-Bold="False"
Font-Italic="False" Font-Overline="False"Font-Strikeout="False"
Font-Underline="False" GridLines="Horizontal"Width="100%"
ondeletecommand="DataList1_DeleteCommand">
<FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
<AlternatingItemStyle BackColor="#F7F7F7"/>
<ItemStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
<SelectedItemStyle BackColor="#738A9C"Font-Bold="True" ForeColor="#F7F7F7"/>
<HeaderStyle BackColor="#4A3C8C" Font-Bold="True"ForeColor="#F7F7F7" />
<ItemTemplate>
新闻ID:
<asp:Label ID="IDLabel" runat="server"Text='<%# Eval("ID") %>' />
<br />
新闻编号:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Eval("TITLE") %>' />
<br />
<asp:ButtonID="Button1" runat="server" Text="删除"
CommandName="delete"CommandArgument='<%# Eval("ID") %>'/>
</ItemTemplate>
</asp:DataList>
上述代码创建了一个DataList控件并配置了按钮控件,并将按钮控件的CommandName属性配置为“delete”,则触发该按钮则会引发DeleteCommand事件。在属性窗口中找到DeleteCommand事件,双击【DeleteCommand】连接系统会自动生成DeleteCommand事件相应的方法。当生成了DeleteCommand事件后,可以在代码段中编写相应的方法,示例代码如下所示。
protected void DataList1_DeleteCommand(object source,DataListCommandEventArgs e)
{
Label1.Text = e. CommandArgument.ToString()+"被执行";
}
当用户单击了相应的按钮时会触发DeleteCommand事件。开发人员能够通过传递过来的参数,可以编写相应的方法,运行结果如图8-33所示。
图8-33 触发DeleteCommand事件
程序运行后,当用户单击了相应的按钮时,开发人员可以通过获取传递的CommandArgument参数的值来编写相应的方法从而执行实现不同的应用。
8.4 数据列表控件(GridView)
GridView是ASP.NET中功能非常丰富的控件之一,它可以以表格的形式显示数据库的内容并通过数据源控件自动绑定和显示数据。开发人员能够通过配置数据源控件对GridView中的数据进行选择、排序、分页、编辑和删除功能进行配置。GridView控件还能够指定自定义样式,在没有任何数据时可以自定义无数据时的UI样式。
1.建立GridView控件
GridView控件为开发人员提供了强大的管理方案,同样GridView也支持内置格式,单击【自动套用格式】连接可以选择GridView中的默认格式,如图8-34所示。
GridView是以表格为表现形式,GridView包括行和列,通过配置相应的属性能够编辑相应的行的样式,同样也可以选择【编辑列】选项来编写相应的列的样式,如图8-35所示。
图8-34 自动套用格式 图8-35 编辑列
GridView控件提供两个用户绑定到数据的选项,其一是使用DataSourceID进行数据绑定,这种方法通常情况下是绑定数据源控件;而另一种则是使用DataSource属性进行数据绑定,这种方法能够将GridView控件绑定到包括ADO.NET数据和数据读取器内的各种对象。
使用DataSourceID进行数据绑定,可以让GridView控件能够自动的处理分页、选择等操作,如图8-36所示。而使用DataSource属性进行数据绑定,则需要开发人员通过编程实现分页等操作。GridView控件能够自定义字段,单击【添加列】按钮,可以选择相应类型的列。在添加列选项中,GridView控件支持多种列类型的列,包括复选框、图片、单选框、超链接等,如图8-37所示。
图8-36 可选相应操作 图8-37 添加字段
添加自定义字段,GridView控件支持从数据源中读取相应的数据源来配置相应的字段,来让开发人员自定义的读取数据源中的相应字段来自定义开发,如图8-38所示。当选择从数据源中获取文本,可以通过Format的形式编写相应的文本。例如,从数据源中获取title列,而显示文本为“这是一个标题:title值”,则可以编写为“这是一个标题:{0}”,如图8-39所示。
图8-38 添加字段 图8-39 格式化字符串输出
配置完成后,GridView控件的HTML标签生成代码如下所示:
<asp:GridViewID="GridView1" runat="server" AllowPaging="True"
AllowSorting="True"AutoGenerateColumns="False"
BackColor="LightGoldenrodYellow"BorderColor="Tan" BorderWidth="1px"
CellPadding="2"DataKeyNames="ID" DataSourceID="SqlDataSource1"
ForeColor="Black"GridLines="None" Width="100%">
<FooterStyleBackColor="Tan" />
<Columns>
<asp:BoundFieldDataField="ID" HeaderText="ID"InsertVisible="False"
ReadOnly="True"SortExpression="ID" />
<asp:BoundFieldDataField="TITLE" HeaderText="TITLE" SortExpression="TITLE"/>
<asp:HyperLinkFieldDataNavigateUrlFields="ID"
DataNavigateUrlFormatString="Default.aspx?uid={0}"DataTextField="TITLE"
DataTextFormatString="Title:{0}"HeaderText="Link" />
</Columns>
<PagerStyleBackColor="PaleGoldenrod" ForeColor="DarkSlateBlue"
HorizontalAlign="Center"/>
<SelectedRowStyleBackColor="DarkSlateBlue" ForeColor="GhostWhite" />
<HeaderStyle BackColor="Tan"Font-Bold="True" />
<AlternatingRowStyleBackColor="PaleGoldenrod" />
</asp:GridView>
上述代码使用了一个默认格式,并新建了一个超链接文本类型的列,当单击超文本链接,则会跳转到另一个页面。
2.GridView控件的常用事件
GridView支持多个事件,通常对GridView 控件进行排序、选择等操作时,同样会引发事件,当创建当前行或将当前行绑定至数据时发生的事件,同样,单击一个命令控件时也会引发事件。GridView 控件常用的事件如下所示。
q RowCommand:在 GridView 控件中单击某个按钮时发生。此事件通常用于在该控件中单击某个按钮时执行某项任务。
q PageIndexChanging:在单击页导航按钮时发生,但在 GridView 控件执行分页操作之前。此事件通常用于取消分页操作。
q PageIndexChanged:在单击页导航按钮时发生,但在 GridView 控件执行分页操作之后。此事件通常用于在用户定位到该控件中不同的页之后需要执行某项任务时。
q SelectedIndexChanging:在单击GridView控件内某一行的Select按钮(其CommandName属性设置为“Select”的按钮)时发生,但在GridView控件执行选择操作之前。此事件通常用于取消选择操作。
q SelectedIndexChanged:在单击 GridView 控件内某一行的 Select按钮时发生,但在GridView 控件执行选择操作之后。此事件通常用于在选择了该控件中的某行后执行某项任务。
q Sorting:在单击某个用于对列进行排序的超链接时发生,但在 GridView 控件执行排序操作之前。此事件通常用于取消排序操作或执行自定义的排序例程。
q Sorted:在单击某个用于对列进行排序的超链接时发生,但在 GridView 控件执行排序操作之后。此事件通常用于在用户单击对列进行排序的超链接之后执行某项任务。
q RowDataBound:在 GridView 控件中的某个行被绑定到一个数据记录时发生。此事件通常用于在某个行被绑定到数据时修改该行的内容。
q RowCreated:在GridView控件中创建新行时发生。此事件通常用于在创建某个行时修改该行的布局或外观。
q RowDeleting:在单击 GridView 控件内某一行的 Delete按钮(其CommandName 属性设置为“Delete”的按钮)时发生,但在 GridView 控件从数据源删除记录之前。此事件通常用于取消删除操作。
q RowDeleted:在单击 GridView 控件内某一行的 Delete按钮时发生,但在GridView 控件从数据源删除记录之后。此事件通常用于检查删除操作的结果。
q RowEditing:在单击 GridView 控件内某一行的 Edit 按钮(其CommandName 属性设置为“Edit”的按钮)时发生,但在GridView控件进入编辑模式之前。此事件通常用于取消编辑操作。
q RowCancelingEdit:在单击 GridView 控件内某一行的 Cancel按钮(其CommandName 属性设置为“Cancel”的按钮)时发生,但在 GridView 控件退出编辑模式之前。此事件通常用于停止取消操作。
q RowUpdating:在单击 GridView 控件内某一行的 Update按钮(其CommandName 属性设置为“Update”的按钮)时发生,但在 GridView 控件更新记录之前。此事件通常用于取消更新操作。
q RowUpdated:在单击GridView控件内某一行的 Update按钮时发生,但在GridView 控件更新记录之后。此事件通常用来检查更新操作的结果。
q DataBound:此事件继承自BaseDataBoundControl 控件,在GridView控件完成到数据源的绑定后发生。
需要指定相应的事件,则必须添加一个RowCommand事件,GridView控件HTML代码如下所示.
<asp:GridViewID="GridView1" runat="server" AllowPaging="True"
AllowSorting="True"AutoGenerateColumns="False"
BackColor="LightGoldenrodYellow"BorderColor="Tan" BorderWidth="1px"
CellPadding="2"DataKeyNames="ID" DataSourceID="SqlDataSource1"
ForeColor="Black"GridLines="None" onrowcommand="GridView1_RowCommand"
Width="100%">
<FooterStyleBackColor="Tan" />
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID"InsertVisible="False"
ReadOnly="True" SortExpression="ID" />
<asp:BoundField DataField="TITLE"HeaderText="TITLE" SortExpression="TITLE" />
<asp:HyperLinkField DataNavigateUrlFields="ID"
DataNavigateUrlFormatString="Default.aspx?uid={0}"DataTextField="TITLE"
DataTextFormatString="Title:{0}" HeaderText="Link"/>
<asp:ButtonField ButtonType="Button" CommandName="
Select" HeaderText="选择按钮"ShowHeader="True" Text="按钮" />
</Columns>
<PagerStyleBackColor="PaleGoldenrod" ForeColor="DarkSlateBlue"
HorizontalAlign="Center" />
<SelectedRowStyleBackColor="DarkSlateBlue" ForeColor="GhostWhite" />
<HeaderStyleBackColor="Tan" Font-Bold="True" />
<AlternatingRowStyleBackColor="PaleGoldenrod" />
</asp:GridView>
上述代码创建了一个GridView控件,并增加了一个按钮控件,并且为按钮控件的CommandName属性赋值为Select,当单击按钮控件时,则会触发RowCommand事件,CS页面代码如下所示。
protected void GridView1_RowCommand(object sender,GridViewCommandEventArgs e)
{
Label1.Text = e.CommandName + "事件被触发";
}
当单击按钮时,GridView控件会选择相应的行。在GridView控件的RowCommand事件中,同样可以通过GridView控件的中按钮的CommandArgument属性获取相应的操作并执行相应代码。GridView控件运行结果如图8-40和图8-41所示。
图8-40 GridView控件的事件 图8-41 触发Select选择事件
注意:在执行其他事件时,如RowDeleted、GridView控件首先执行RowDataBound代码,然后执行RowCommnad、RowDeleting以及RowDeleted等事件。
8.5 数据绑定控件(FormView)
FormView控件只能显示数据库中一行的数据,并且提供对数据的分页操作,FormView控件可以以一种不规则的外观来将数据呈现给用户。FormView控件同样支持模板,以方便开发人员自定义FormView控件的UI,FormView控件支持的模板如下所示:
q ItemTemplate:用于在FormView种呈现一个特殊的记录。
q HeaderTemplate:用于指定一个可选的页眉行。
q FooterTemplate:用于指定一个可选的页脚行。
q EmptyDataTemplate:当FormView的DataSource缺少记录的时候,EmptyDataTemplate将会代替ItemTemplate来生成控件的标记语言。
q PagerTemplate:如果FormView启用了分页的话,这个模板可以用于自定义分页的界面。
q EditItemTemplate /InsertItemTemplate:如果FormView支持编辑或插入功能,那么这两种模板可以用于自定义相关的界面。
通过编辑ItmTemplate,能够自定义HTML以呈现数据,这种情况很像Repeater控件。FormView控件同样支持自动套用格式,选择【自动套用格式】选项就能够为FormView控件选择默认格式,选择后如图8-42所示。
图8-42 自定义FormView控件
当FormView控件界面编写完成后,HTML代码如下所示。
<asp:FormView ID="FormView1" runat="server"AllowPaging="True"
BackColor="White"BorderColor="#3366CC" BorderStyle="None"BorderWidth="1px"
CellPadding="4"DataKeyNames="ID" DataSourceID="SqlDataSource1"
GridLines="Both"Width="100%">
<FooterStyle BackColor="#99CCCC"ForeColor="#003399" />
<RowStyle BackColor="White" ForeColor="#003399"/>
<EditItemTemplate>
ID:
<asp:LabelID="IDLabel1" runat="server" Text='<%#Eval("ID") %>' /><br />
TITLE:
<asp:TextBoxID="TITLETextBox" runat="server" Text='<%#Bind("TITLE") %>' /><br />
<asp:LinkButtonID="UpdateButton" runat="server"CausesValidation="True"
CommandName="Update"Text="更新" />
<asp:LinkButtonID="UpdateCancelButton" runat="server"
CausesValidation="False"CommandName="Cancel" Text="取消" />
</EditItemTemplate>
<InsertItemTemplate>
TITLE:
<asp:TextBoxID="TITLETextBox" runat="server" Text='<%#Bind("TITLE") %>' /> <br />
<asp:LinkButton ID="InsertButton"runat="server" CausesValidation="True"
CommandName="Insert"Text="插入" />
<asp:LinkButtonID="InsertCancelButton" runat="server"
CausesValidation="False"CommandName="Cancel" Text="取消" />
</InsertItemTemplate>
<ItemTemplate>
新闻编号:
<asp:LabelID="IDLabel" runat="server" Text='<%#Eval("ID") %>' /><br />
新闻标题:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Bind("TITLE") %>' /><br />
</ItemTemplate>
<PagerStyle BackColor="#99CCCC"ForeColor="#003399" HorizontalAlign="Left" />
<HeaderStyle BackColor="#003399" Font-Bold="True"ForeColor="#CCCCFF" />
<EditRowStyle BackColor="#009999"Font-Bold="True" ForeColor="#CCFF99" />
</asp:FormView>
上述代码创建了FormView控件,并为FormView控件自定义了若干模板。刚才只是编写了ItemTemplate模板,但是EdititemTemplate也已经在HTML标签中生成。
注意:FormView控件模板中的相应数据字段也是通过数据绑定语法实现的,如<%# Eval("字段名称")%>。
FormView控件同样支持对当前数据的更新、删除、选择等操作。当拖放一个按钮控件时,可以选择DataBindings来为按钮控件的属性做相应的配置,如图8-43所示。
图8-43 DataBindings
当单击FormView中的控件时,会触发Command事件,要使用FormView控件进行更新等操作,必须在相应的模式下更新才行,例如当需要更新操作时,则必须在编辑模式下才能进行更新操作。当执行相应的操作时,例如更新操作,则必须在编辑模式下进行操作,并需要使用ItemUpdated事件来编写相应的更新事件。编写FormView控件中的ItemTemplate和EditItemTemplate,生成的HTML代码如下所示。
<asp:FormViewID="FormView1" runat="server" AllowPaging="True"
BackColor="White"BorderColor="#3366CC" BorderStyle="None"BorderWidth="1px"
CellPadding="4"DataKeyNames="ID" DataSourceID="SqlDataSource1"
GridLines="Both"Width="100%" onitemcommand="FormView1_ItemCommand"
onitemupdated="FormView1_ItemUpdated">
<FooterStyleBackColor="#99CCCC" ForeColor="#003399" />
<RowStyle BackColor="White" ForeColor="#003399"/>
<EditItemTemplate>
新闻编号:
<asp:Label ID="IDLabel1" runat="server"Text='<%# Eval("ID") %>' />
<br />
新闻标题:
<asp:TextBox ID="TITLETextBox" runat="server"Text='<%# Bind("TITLE") %>' />
<br />
<asp:LinkButton ID="UpdateButton" runat="server"CausesValidation="True"
CommandName="Update" Text="更新" />
<asp:LinkButton ID="UpdateCancelButton"runat="server"
CausesValidation="False" CommandName="Cancel"Text="取消" />
</EditItemTemplate>
<InsertItemTemplate>
TITLE:
<asp:TextBox ID="TITLETextBox" runat="server"Text='<%# Bind("TITLE") %>' />
<br />
<asp:LinkButton ID="InsertButton" runat="server"CausesValidation="True"
CommandName="Insert" Text="插入" />
<asp:LinkButtonID="InsertCancelButton" runat="server"
CausesValidation="False" CommandName="Cancel"Text="取消" />
</InsertItemTemplate>
<ItemTemplate>
新闻编号:
<asp:LabelID="IDLabel" runat="server" Text='<%#Eval("ID") %>' /><br />
新闻标题:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Bind("TITLE") %>' /><br />
</ItemTemplate>
<PagerStyleBackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left"/>
<HeaderStyleBackColor="#003399" Font-Bold="True"ForeColor="#CCCCFF" />
<EditRowStyleBackColor="#009999" Font-Bold="True"ForeColor="#CCFF99" />
</asp:FormView>
上述代码编写了FormView控件中的ItemTemplate和EditItemTemplate。在页面中,增加了按钮来切换FormView控件的编辑模式,按钮控件代码如下所示。
<asp:Button ID="Button2" runat="server"οnclick="Button2_Click" Text="Edit" />
当单击按钮时,FormView控件会更改其编辑模式,示例代码如下所示。
protected void Button2_Click(object sender, EventArgs e)
{
FormView1.ChangeMode(FormViewMode.Edit); //更改编辑模式
}
当更改了编辑模式后,FormView控件允许在当前页面直接更改数据的值,并通过ItemUpdated进行更新,示例代码如下所示。
protected void FormView1_ItemUpdated(object sender,FormViewUpdatedEventArgs e)
{
Label1.Text = "相应值被更新"; //提示已被更改
FormView1.ChangeMode(FormViewMode.ReadOnly); //更改编辑模式
}
上述代码允许开发人员能够自定义数据操作,通过对象e的值来获取相应的数据字段的值并进行更新,运行结果如图8-44和8-45所示。
图8-44 视图模式 图8-45 编辑模式
当单击了其中的更新,则会触发ItemUpdated事件,开发人员能够通过编写ItemUpdated事件来进行相应的更新操作。值得注意的是,通常情况下数据源控件必须支持更新操作才能够执行更新,在配置数据源时,需要为更新语句进行配置。在配置和生成SQL语句中必须选择【高级】选项、勾选【生成update、insert、delete语句】复选框才能够让数据源控件支持更新等操作,如图8-46所示。
图8-46 高级数据源配置
如果数据绑定控件需要使用Insert等语句时,则数据源控件需配置高级SQL生成选项,开发人员还能够在数据源控件的HTML代码中进行相应的SQL语句的更改已达到自定义数据源控件的目的。
8.6 数据绑定控件(DetailsView)
DetailsView控件与FormView在很多情况下非常类似,DetailsView控件通常情况下也只能够显示一行的数据,同FormView,DetailsView控件支持对数据源控件中的数据进行插入、删除和更新。但是DetailsView控件与FormView控件不同的是,DetailsView控件不支持ItemTemplate模板,这也就是说,DetailsView控件是以一种表格的形式所呈现的。
相比之下,DetailsView控件能够支持Ajax,因为FormView控件完全由模板驱动,但是FormView控件对验证控件的支持较好。而DetailsView控件可以通过选择是否包括更新,删除等操作,而无需手动的添加相应的事件,比FormView控件更加方便,如图8-47和图8-48所示。
图8-47 配置DetailsView任务 图8-48 减少任务配置
当选择了【启用分页】选项后DetailsView控件就能够自动进行分页。开发人员还可以配置PagerSettings属性允许自定义DetailsView控件生成分页用户界面的外观,它将呈现向前和向后导航的方向控件,PagerSettings属性的常用模式有:
q NextPrevious:以前一个,下一个形式显示。
q NextPreviousFirstLast:以前一个,下一个,最前一个,最后一个形式显示。
q Numeric:以数字形式显示。
q NumericFirstLast::以数字,最前一个,最后一个形式显示。
当完成配置DetailsView控件后,DetailsView控件无需通过外部控件来转换DetailsView控件的编辑模式,DetailsView控件自动会显示更新、插入、删除等按钮来更改编辑模式,如图8-49所示。
图8-49 DetailsView控件
编辑完成后,DetailsView控件生成的HTML代码如下所示。
<asp:DetailsViewID="DetailsView1" runat="server"AllowPaging="True"
AutoGenerateRows="False" BackColor="White"BorderColor="#999999"
BorderStyle="None"BorderWidth="1px" CellPadding="3"DataKeyNames="ID"
DataSourceID="SqlDataSource1" GridLines="Vertical"Height="50px" Width="100%">
<FooterStyleBackColor="#CCCCCC" ForeColor="Black" />
<RowStyleBackColor="#EEEEEE" ForeColor="Black" />
<PagerStyleBackColor="#999999" ForeColor="Black"HorizontalAlign="Center" />
<Fields>
<asp:BoundField DataField="ID" HeaderText="ID"InsertVisible="False"
ReadOnly="True"SortExpression="ID" />
<asp:BoundField DataField="TITLE"HeaderText="TITLE" SortExpression="TITLE" />
<asp:CommandField ShowDeleteButton="True"ShowEditButton="True"
ShowInsertButton="True" />
</Fields>
<HeaderStyleBackColor="#000084" Font-Bold="True"ForeColor="White" />
<EditRowStyleBackColor="#008A8C" Font-Bold="True"ForeColor="White" />
<AlternatingRowStyleBackColor="#DCDCDC" />
</asp:DetailsView>
如上一节内容所讲,在数据源控件的配置中配置SQL语句,需要选择高级,勾选【生成update、insert、delete语句】复选框以支持自动生成更新、删除等语句的生成。当勾选了【生成update、insert、delete语句】复选框后,数据源控件代码如下所示。
<asp:SqlDataSourceID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:mytableConnectionString%>"
DeleteCommand="DELETE FROM [mynews] WHERE [ID] = @ID"
InsertCommand="INSERT INTO [mynews] ([TITLE]) VALUES (@TITLE)"
SelectCommand="SELECT * FROM [mynews]"
UpdateCommand="UPDATE [mynews] SET [TITLE] = @TITLE WHERE [ID] =@ID">
<DeleteParameters>
<asp:Parameter Name="ID" Type="Int32" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="TITLE" Type="String" />
<asp:Parameter Name="ID" Type="Int32" />
</UpdateParameters>
<InsertParameters>
<asp:ParameterName="TITLE" Type="String" />
</InsertParameters>
</asp:SqlDataSource>
从上述代码可以看出,数据源控件自动生成了相应的SQL语句,如图8-50所示。当执行更新、删除等操作时,则会默认执行该语句。运行结果如图8-51所示。
图8-50 更改相应字段的值 图8-51 更改后的控件呈现
8.7 数据绑定控件(ListView)
ListView控件是ASP.NET 3.5中新增的数据绑定控件,ListView控件是介于GridView控件和Repeater之间的另一种数据绑定控件,相对于GridView来说,它有着更为丰富的布局手段,开发人员可以在ListView控件的模板内写任何HTML标记或者控件。相比于GridView和Repeater控件而言,ListView支持的模板如下所示:
q AlternatingItemTemplate:交替项目模板,用不同的标记显示交替的项目,便于查看者区别连续不断的项目。
q EditItemTemplate:编辑项目模板,控制编辑时的项目显示。
q EmptyDataTemplate:空数据模板,控制ListView数据源返回空数据时的显示。
q EmptyItemTemplate:空项目模板,控制空项目的显示。
q GroupSeparatorTemplate:组分隔模板,控制项目组内容的显示。
q GroupTemplate:组模板,为内容指定一个容器对象,如一个表行、div或span组件。
q InsertItemTemplate:插入项目模板,用户插入项目时为其指定内容。
q ItemSeparatorTemplate:项目分隔模板,控制项目之间内容的显示。
q ItemTemplate项目模板:控制项目内容的显示。
q LayoutTemplate:布局模板,指定定义容器对象的根组件,如一个table、div或span组件,它们包装ItemTemplate或GroupTemplate定义的内容。
q SelectedItemTemplate:已选择项目模板,指定当前选中的项目内容的显示。
其中最为常用的控件包括LayoutTemplate和ItemTemplate,LayoutTemplate为ListView控件指定了总的标记,而ItemTemplate指定的标记用于显示每个绑定的记录,用来编写HTML样式。ListView控件能够自动套用HTML格式,如其他控件一样,可以选择默认模板,单击【配置ListView】连接进行格式套用,如图8-52所示。
图8-52 配置ListView
开发人员能够选择相应的布局并选择相应的样式来确定ListView控件的界面,开发人员还可以通过选择【启用编辑】、【启用插入】等选项简化开发。
注意:当需要执行相应的数据操作时,数据源控件的高级选项都应该勾选。
当选择相应的布局方案和样式后,系统生成的ListView控件的HTML代码如下所示。
<asp:ListView ID="ListView1" runat="server"DataKeyNames="ID"
DataSourceID="SqlDataSource1"InsertItemPosition="LastItem">
<AlternatingItemTemplate>
<li style="background-color: #FFF8DC;">ID:
<asp:Label ID="IDLabel" runat="server"Text='<%# Eval("ID") %>' />
<br />
TITLE:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Eval("TITLE") %>' />
<br />
<asp:Button ID="EditButton" runat="server"CommandName="Edit" Text="编辑" />
<asp:ButtonID="DeleteButton" runat="server"CommandName="Delete" Text="删除" />
</li>
</AlternatingItemTemplate>
<LayoutTemplate>
<ul ID="itemPlaceholderContainer" runat="server"
style="font-family: Verdana,Arial, Helvetica, sans-serif;">
<li ID="itemPlaceholder" runat="server" />
</ul>
<div style="text-align: center;background-color:#CCCCCC;font-family: Verdana, Arial,
Helvetica, sans-serif;color:#000000;">
<asp:DataPager ID="DataPager1" runat="server">
<Fields>
<asp:NextPreviousPagerField ButtonType="Button"ShowFirstPageButton="True"
ShowLastPageButton="True" />
</Fields>
</asp:DataPager>
</div>
</LayoutTemplate>
<InsertItemTemplate>
<li style="">TITLE:
<asp:TextBox ID="TITLETextBox" runat="server"Text='<%# Bind("TITLE") %>' />
<br />
<asp:Button ID="InsertButton" runat="server"CommandName="Insert" Text="插入" />
<asp:Button ID="CancelButton" runat="server"CommandName="Cancel" Text="清除" />
</li>
</InsertItemTemplate>
<SelectedItemTemplate>
<li style="background-color: #008A8C;font-weight:bold;color: #FFFFFF;">ID:
<asp:Label ID="IDLabel" runat="server"Text='<%# Eval("ID") %>' />
<br />
TITLE:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Eval("TITLE") %>' />
<br />
<asp:Button ID="EditButton" runat="server" CommandName="Edit"Text="编辑" />
<asp:Button ID="DeleteButton" runat="server"CommandName="Delete" Text="删除" />
</li>
</SelectedItemTemplate>
<EmptyDataTemplate>
未返回数据。
</EmptyDataTemplate>
<EditItemTemplate>
<li style="background-color: #008A8C;color:#FFFFFF;">ID:
<asp:Label ID="IDLabel1" runat="server"Text='<%# Eval("ID") %>' />
<br />
TITLE:
<asp:TextBoxID="TITLETextBox" runat="server" Text='<%#Bind("TITLE") %>' />
<br />
<asp:Button ID="UpdateButton" runat="server"CommandName="Update" Text="更新" />
<asp:Button ID="CancelButton" runat="server"CommandName="Cancel" Text="取消" />
</li>
</EditItemTemplate>
<ItemTemplate>
<listyle="background-color: #DCDCDC;color: #000000;">ID:
<asp:Label ID="IDLabel" runat="server"Text='<%# Eval("ID") %>' />
<br />
TITLE:
<asp:Label ID="TITLELabel" runat="server"Text='<%# Eval("TITLE") %>' />
<br />
<asp:Button ID="EditButton" runat="server"CommandName="Edit" Text="编辑" />
<asp:Button ID="DeleteButton" runat="server"CommandName="Delete" Text="删除" />
</li>
</ItemTemplate>
<ItemSeparatorTemplate>
<br/>
</ItemSeparatorTemplate>
</asp:ListView>
上述代码定义了ListView控件,系统默认创建了相应的模板,开发人员能够编辑相应的模板样式来为不同的编辑模式显示不同的用户界面。同时,用户可以无需代码实现就能够实现删除,更新以及添加等操作,运行结果如图8-53所示。
图8-53 ListView控件
LayoutTemplate和ItemTemplate是标识定义控件的主要布局的根模板。通常情况下,它包含一个占位符对象,例如表行tr或div元素。此元素将由ItemTemplate模板或GroupTemplate模板中定义的内容替换。
如果需要定义自定义用户界面,则必须使用LayoutTemplate模板可以作为ListView控件的父容器。LayoutTemplate模板是ListView控件所必需的。相同的是,LayoutTemplate内容也需要包含一个占位符控件。占位符控件必须将包含runat=“server”属性,并且将ID属性设置为ItemPlaceholderID或 GroupPlaceholderID属性的值,示例代码如下所示。
<ItemTemplate>
<tdrunat="server" style="background-color:#DCDCDC;color:#000000;">
ID:
<asp:LabelID="IDLabel" runat="server" Text='<%#Eval("ID") %>' /><br />
TITLE:
<asp:LabelID="TITLELabel" runat="server" Text='<%#Eval("TITLE") %>' /><br />
<asp:ButtonID="DeleteButton" runat="server"CommandName="Delete" Text="删除" /><br />
<asp:ButtonID="EditButton" runat="server" CommandName="Edit"Text="编辑" /><br />
</td>
</ItemTemplate>
ListView控件的事件和FormView控件的事件基本相同,同样可以为ListView控件执行更新、删除或添加等事件编写相应的代码。当执行更新前、更新时都可以触发相应的事件,示例代码如下所示。
protected void ListView1_ItemUpdated(object sender,ListViewUpdatedEventArgs e)
{
Label1.Text = "更新已经发生"; //触发更新事件
}
当运行后,则会触发ItemUpdated事件,运行结果如图8-54所示。
图8-54 ItemUpdated事件
ListView控件不仅能够支持FormView控件的事件,而ListView控件具有更多的布局手段。ListView控件能为开发人员在开发中提供极大的遍历,当如果需要进行相应的数据操作,又需要快捷的显式数据和添加数据时,ListView控件是极佳的选择。
8.8 数据绑定控件(DataPager)
DataPager控件通过实现IPageableItemContainer接口实现了控件的分页。在ASP.NET3.5中,ListView控件适合可以使用DataPager控件进行分页操作。要在ListView中使用DataPager控件只需要在LayoutTemplate模板中加入DataPager控件。DataPager控件包括两种样式,一种是“上一页/下一页”样式,第二种是“数字”样式,如图8-55和图8-56所示。
图8-55 文本样式 图8-56 数字样式
当使用“上一页/下一页”样式时,DataPager控件的HTML实现代码如下所示。
<asp:DataPagerID="DataPager1" runat="server">
<Fields>
<asp:NextPreviousPagerFieldButtonType="Button" ShowFirstPageButton="True"
ShowLastPageButton="True"/>
</Fields>
</asp:DataPager>
当使用“数字”样式时,DataPager控件的HTML实现代码如下所示。
<asp:DataPagerID="DataPager1" runat="server">
<Fields>
<asp:NextPreviousPagerFieldButtonType="Button" ShowFirstPageButton="True"
ShowNextPageButton="False"ShowPreviousPageButton="False" />
<asp:NumericPagerField/>
<asp:NextPreviousPagerFieldButtonType="Button" ShowLastPageButton="True"
ShowNextPageButton="False"ShowPreviousPageButton="False" />
</Fields>
</asp:DataPager>
除了默认的方法来显示分页样式,还可以通过向DataPager中的Fields中添加TemplatePagerField的方法来自定义分页样式。在TemplatePagerField中添加PagerTemplate,在PagerTemplate中添加任何服务器控件,这些服务器控件可以通过实现TemplatePagerField的OnPagerCommand事件来实现自定义分页。
8.9 小结
本章介绍了有关ASP.NET中绑定数据和数据源相关的控件,在ASP.NET中,这些控件强大的功能让开发变得更加的简单。在ASP.NET中,正是因为这些数据源控件和数据绑定控件,让开发人员在页面开发时,无需更多的操作即可实现强大的功能,解决了在传统的ASP中难以解决的问题。本章还包括:
q ADO.NET:讲解了ADO.NET,并介绍了使用ADO.NET连接数据库。
q 数据源控件:包括SqlDataSource等常用的数据源控件,并一步步的介绍了数据源控件的配置。
q 重复列表控件:讲解了如Repeater之类的重复列表控件。
q 数据绑定控件:讲解了常用的数据绑定控件并使用数据绑定控件对数据进行更新,删除等操作。
数据操作无论是在Web开发还是在Win Form开发中,都是要经常使用的,数据控件能够极大的简化开发人员对数据的操作,让开发更加迅速。