当前位置: 王朝网络 >> asp >> 使用 ASP+ DataGrid 控件来创建主视图/详细资料视图

使用 ASP+ DataGrid 控件来创建主视图/详细资料视图

王朝asp·作者佚名 2006-12-16

Nikhil Kothari

Microsoft Corporation

2000年8月

摘要: DataGrid 控件是与 ASP+ Page Framework 一起发运的数据绑定的服务器控件。本文使用 DataGrid 来建立包含主/详细资料视图的 Web 页面。还探讨控件所提供功能的各个方面，包括排序、编辑、分页和模板列，而控件就是使用这些功能来建立最终的页面的。

下载 DataGridSamples.exe 文件。(119 KB)

简介

我们要建立什么?

第 1 步: 一个基本的 DataGrid

第 2 步: 带有多页面的主/详细资料视图

第 3 步: 单页面中的主/详细资料视图

第 4 步: 排序

第 5 步: 分页

第 6 步: 原地编辑

第 7 步: 使用模板

第 8 步: 定制列

结论

简介

Microsoft® Visual Studio.NET 的下一发行版包括 DataGrid Web 控件 (作为服务器控件的 Active Server Page+ (ASP+) 套件的一部分)。该控件提供用以根据数据源的内容来表示 HTML 的功能。

DataGrid 控件可以用于若干个只读汇报情形。该控件设计用于对丰富而完全可定制的数据表格布局的输出进行简化。还提供多个机制，用于通过超级链接及其对选择、排序、分页和原地编辑和其它特性的支持，为输出添加交互性。这使得该控件在若干的常见 Web 应用方案中很有用，诸如列表、购物车和查询结果。

DataGrid 还提供一些功能，这些功能具有 ASP+ 架构所特有的所有服务器控件的特点。该控件包含进行与浏览器无关的输出所需的逻辑，同时提供了一个统一的编程模型，从而能够处理回传数据，以及对请求之间的状态进行管理。这样，开发商就可以针对带有属性、方法和事件的对象模型进行编程，而不必处理直接用 HTML 编程所带来的不一致性和复杂性。

使用 ASP+ 列表绑定控件 (英文) 介绍 DataGrid 控件以及相关的 DataList 和 Repeater 控件。还介绍了数据绑定、模板和格式化等等多个关键的概念。该文以此为基础写成，并将重点放在 DataGrid 控件，以揭示如何在您自己的应用程序中利用该控件所提供的功能。

我们要建立什么?

该文举出了一序列的示例页面，彼此结合，从而最终生成一个页面，该页面以示例数据库的 Authors 表和 Titles 表为依据，提供主/详细资料视图（该数据库随 Microsoft SQL Server™2000 一起发运）。序列中的每个页面均介绍 DataGrid 控件的一个新的特性或功能。下列图象是从 pubs 数据库抽取出来的。

主/详细资料视图类似于 Microsoft Access 所介绍的窗体/子窗体概念。也类似于随 Microsoft Visual InterDev®6.0 一起发运的 DataForm Wizard （数据窗体向导）。主/详细资料视图显示一到多的关系结果，其中视图的一个部分显示第一个查询或主查询的结果。然后跟踪一个选择，以筛选所使用的第二个查询的结果，从而在视图的另一部分显示选择内容的详细资料。

图 1. 完成的页面

图 1 将 Author 列表显示在页面的上半部分，并将关于所选作者的详细资料（包括相关书名）显示在下半部分。 Authors 列表和 Titles 均是用 DataGrid 控件加以表示的。显示作者的 DataGrid 举例说明如何进行选择、排序、和分页。显示书名的 DataGrid 演示如何进行原地编辑、格式化和定制列。

数据访问

为了使示例自成一体，从 SQL Server 抽取数据并将该数据连同其架构信息一同保留为一个 XML 文件 TitlesDB.xml。下面是该文件的一个片断。

<root>

<schema id="DocumentElement" targetNamespace=""

xmlns="http://www.w3.org/1999/XMLSchema"

xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">

<element name="au_id" type="string" minOccurs="1"

maxOccurs="1"></element>

<element name="au_name" type="string" minOccurs="1"

maxOccurs="1"></element>

<element name="address" type="string" minOccurs="0"

maxOccurs="1"></element>

<element name="city" type="string" minOccurs="0"

maxOccurs="1"></element>

<element name="state" type="string" minOccurs="0"

maxOccurs="1"></element>

<element name="zip" type="string" minOccurs="0"

maxOccurs="1"></element>

<element name="phone" type="string" minOccurs="0"

maxOccurs="1"></element>

</complexType>

</unique>

</element>

<element name="title_id" type="string" minOccurs="1"

maxOccurs="1"></element>

<element name="au_id" type="string" minOccurs="1"

maxOccurs="1"></element>

<element name="title" type="string" minOccurs="1"

maxOccurs="1"></element>

<element name="price" msdata:DataType="System.Currency"

type="string"

minOccurs="1" maxOccurs="1"></element>

<element name="pubdate" type="timeInstant" minOccurs="1"

maxOccurs="1"></element>

</complexType>

<field>title_id</field>

</unique>

<selector>../Author</selector>

</key>

</keyref>

</element>

</schema>

<au_id>154-00-1300</au_id>

<au_name>John Doe</au_name>

<address>One Microsoft Way</address>

<city>Redmond</city>

</Author>

<Title>

<title_id>BU1032</title_id>

<au_id>213-46-8915</au_id>

<title>The Busy Executive's Database Guide</title>

</Title>

</DocumentElement>

</root>

这些样例简化了数据访问，从而将重点全部放在 DataGrid 的使用上。上面的 XML 被加载进一个 DataSet。 DataSet 为数据提供高速缓存，从而可以进行筛选、排序和编辑等等各种操作。下面的代码来自 Global.asax，用于加载 DataSet 和将其保存为 Session 状态。

public void Session_OnStart() {

// 将样例中所用的数据载入会话范围的 DataSet.

FileStream fs = null;

DataSet ds = null;

try {

fs = new FileStream(Server.MapPath("Data\\TitlesDB.xml"),

FileMode.Open, FileAccess.Read);

ds = new DataSet();

ds.ReadXml(fs);

} finally {

if (fs != null) {

fs.Close();

fs = null;

}

Session["AppData"] = ds;

}

在实际的 Web 应用程序中，通常不是使用处于 Session 或 Application 状态的高速缓存数据，而是通过所存储的过程、中间层业务对象，或通过调用 Web 服务所揭示的方法来访问和修改数据。无论采取怎样的手段来访问数据，您会发现你依旧以同样的方式来编程和与控件的对象模型进行进行交互。 www.IBuySpy.com (英文) 网站就是演示这些概念的一个很好的应用示例。

第 1 步: 一个基本的 DataGrid

序列的第一步展示了一个页面，其中包含单独一个 DataGrid 控件，用于显示来自数据源的一个只读作者列表。结果类似于使用 ASP+ 列表绑定控件 (英文) 所取得的效果。

图 2. 完成第 1 步后的页面

DataGrid 声明来自:

Step1.aspx: <asp:DataGrid id="authorsGrid" runat="server"

AutoGenerateColumns="false"

BackColor="White"

BorderWidth="1px" BorderStyle="Solid" BorderColor="Tan"

CellPadding="2" CellSpacing="0"

Font-Name="Verdana" Font-Size="8pt">

<asp:BoundColumn HeaderText="ID" DataField="au_id">

<asp:TableItemStyle Width="100px"/>

</property>

</asp:BoundColumn>

<asp:BoundColumn HeaderText="Name" DataField="au_name">

<asp:TableItemStyle Width="150px"/>

</property>

</asp:BoundColumn>

<asp:BoundColumn HeaderText="State" DataField="state">

<asp:TableItemStyle Width="50px"/>

</property>

</asp:BoundColumn>

</property>

<asp:TableItemStyle BackColor="DarkRed" ForeColor="White"

Font-Bold="true"/>

</property>

<asp:TableItemStyle ForeColor="DarkSlateBlue"/>

</property>

<asp:TableItemStyle BackColor="Beige"/>

</property>

</asp:DataGrid>

上面的代码展示 DataGrid，该控件的各种属性已经过声明设定。 DataGrid 控件与其它 Web 控件如 Font、BackColor、ForeColor 和 BorderWidth 共享一组公用的样式属性。另外， DataGrid 提供仅适用于表的属性如 CellPadding。最后， DataGrid 提供附加的样式属性，这些样式属性影响其中各项目和列如 HeaderStyle、ItemStyle 和 AlternatingItemStyle 的表示。这些样式属性用于创建丰富多采且极富魅力的数据视觉效果。

DataGrid 支持从其所绑定的数据源自动生成列的功能。但是，在本例中， AutoGenerateColumns 属性已被设定为 false。因此必须借助要展示的列集对 Columns 集合进行初始化。从而可以更多地控制表现效果，诸如列的次序和标头以及与每列对应的样式。这一步中所定义的列均为 BoundColumns，从而可以通过其 DataField 属性，绑定到数据源的单独一个字段。您在以后步骤中可以看到， DataGrid 允许选择各种各样类型的列。

下面的类包含支持本页面的代码。

Step1Page.cs: namespace Samples {

...

public class Step1Page : Page {

protected DataGrid authorsGrid;

// 检索存入会话状态的应用程序数据

private DataSet GetSessionData() {

return (DataSet)Session["AppData"];

}

// 检索 Auth

[1] [2] [3] [4] [5] 下一页

点击展开全文