ListView_Web_服务器控件概述.docx

此文档收集于网络，如有侵权，请联系网站删除ListView Web 服务器控件概述.NET Framework 4其他版本 Visual Studio 2008利用 ASP.NET ListView 控件，可以绑定从数据源返回的数据项并显示它们。这些数据可以显示在多个页面。您可以逐个显示数据项，也可以对它们分组。ListView 控件会按照您使用模板和样式定义的格式显示数据。与 DataList 和 Repeater 控件相似，此控件也适用于任何具有重复结构的数据。但与这些控件不同的是，ListView 控件允许用户编辑、插入和删除数据，以及对数据进行排序和分页，所有这一切都无需编写代码。本主题包括： 将数据绑定到 ListView 控件 为 ListView 控件创建模板 对数据进行分页 对数据进行排序 修改数据 对 ListView 项应用样式 类参考 代码示例 其他资源将数据绑定到 ListView 控件通过下列方法，可以将 ListView 控件绑定到数据： 使用 DataSourceID 属性。通过此属性可以将 ListView 控件绑定到数据源控件，例如 SqlDataSource 控件。我们建议采用这种方法，因为它可以使 ListView 控件利用数据源控件的功能。此外，它还可以提供用于排序、分页、插入、删除和更新操作的内置功能。采用这种方法时，还可以使用双向绑定表达式。有关数据源控件的更多信息，请参见数据源控件概述。 使用 DataSource 属性。此属性允许绑定到各种对象，包括 ADO.NET 数据集、数据读取器以及内存中的结构（例如集合）。采用此方法时，您需要为所有附加功能（例如排序、分页和更新）编写代码。返回页首为 ListView 控件创建模板与在 DataList 和 Repeater 控件中使用模板的方法类似，ListView 控件显示的项可以由模板定义。利用 ListView 控件，可以逐项显示数据，也可以按组显示数据。如果使用的是布局模板，则可以通过创建 LayoutTemplate 模板来定义 ListView 控件的主（根）布局。LayoutTemplate 必须包含一个充当数据占位符的控件。例如，该布局模板可以包含 ASP.NET Table、Panel 或 Label 控件。（它还可以包含 runat 特性设置为“server”的 table、div 或 span 元素）。如果没有定义布局模板，则会自动插入一个占位符控件。此占位符控件包含 ItemTemplate 模板所定义的每个项的输出，您可以在 GroupTemplate 模板定义的内容中对这些输出进行分组。在 ItemTemplate 模板中，需要定义各个项的内容。此模板包含的控件通常已绑定到数据列或其他单个数据元素。对项分组使用 GroupTemplate 模板，可以选择对 ListView 控件中的项进行分组。对项分组通常是为了创建平铺的表布局。在平铺的表布局中，各个项将在行中重复 GroupItemCount 属性指定的次数。注意在未定义布局的情况下，如果将 GroupItemCount 属性设置为一个大于零的值，并且还定义 ItemTemplate 属性，则此控件会如同定义了 LayoutTemplate 属性一样工作。如果定义 LayoutTemplate 属性，则 PlaceHolder 控件必须存在。为创建平铺的表布局，布局模板可以包含 ASP.NET Table 控件以及将 runat 特性设置为“server”的 HTML table 元素。随后，组模板可以包含 ASP.NET TableRow 控件（或 HTML tr 元素）。而项模板可以包含 ASP.NET TableCell 控件（或 HTML td 元素）中的各个控件。使用 EditItemTemplate 模板，可以提供已绑定数据的用户界面，从而使用户可以修改现有的数据项。使用 InsertItemTemplate 模板还可以定义已绑定数据的用户界面，以使用户能够添加新的数据项。有关更多信息，请参见本主题后面的修改数据。可用的模板下表列出了可用于 ListView 控件的所有模板。LayoutTemplate标识定义控件的主要布局的根模板。它包含一个占位符对象，例如表行 (tr)、div 或 span 元素。此元素将由 ItemTemplate 模板或 GroupTemplate 模板中定义的内容替换。它还可能包含一个 DataPager 对象。ItemTemplate标识要为各个项显示的数据绑定内容。ItemSeparatorTemplate标识要在各个项之间呈现的内容。GroupTemplate标识组布局的内容。它包含一个占位符对象，例如表单元格 (td)、div 或 span。该对象将由其他模板（例如 ItemTemplate 和 EmptyItemTemplate 模板）中定义的内容替换。GroupSeparatorTemplate标识要在项组之间呈现的内容。EmptyItemTemplate标识在使用 GroupTemplate 模板时为空项呈现的内容。例如，如果将 GroupItemCount 属性设置为 5，而从数据源返回的总项数为 8，则 ListView 控件显示的最后一行数据将包含 ItemTemplate 模板指定的 3 个项以及 EmptyItemTemplate 模板指定的 2 个项。EmptyDataTemplate标识在数据源未返回数据时要呈现的内容。SelectedItemTemplate标识为区分所选数据项与显示的其他项，而为该所选项呈现的内容。AlternatingItemTemplate标识为便于区分连续项，而为交替项呈现的内容。EditItemTemplate标识要在编辑项时呈现的内容。对于正在编辑的数据项，将呈现 EditItemTemplate 模板以替代 ItemTemplate 模板。InsertItemTemplate标识要在插入项时呈现的内容。将在 ListView 控件显示的项的开始或末尾处呈现 InsertItemTemplate 模板，以替代 ItemTemplate 模板。通过使用 ListView 控件的 InsertItemPosition 属性，可以指定 InsertItemTemplate 模板的呈现位置。更改项模板下面的示例演示了采用布局模板的项模板的基本结构。复制 asp:Label ID=NameLabel runat=server Text= / 下面的示例演示了采用布局模板的项模板的基本结构。复制 asp:Label ID=NameLabel runat=server Text= / 若要逐个显示项，请向 LayoutTemplate 模板中添加一个服务器端控件，并将该控件的 ID 属性设置为 itemPlaceholder。该控件只是其他模板（通常为 ItemTemplate 模板）的占位符。这样，该控件在运行时将被其他模板中的内容替换。注意通过将 ItemPlaceholderID 属性设置为一个新值，可以更改用于标识项容器的 ID 属性的值。定义布局模板后，可以添加 ItemTemplate 模板，它通常包含用于显示数据绑定内容的控件。通过使用 Eval 方法将这些控件绑定到数据源中的值，可以指定要用于显示每个项的标记。有关 Eval 元素的更多信息，请参见 数据绑定表达式概述。ItemSeparatorTemplate 模板用于标识要在各个项之间包括的内容，若要提供其他内容进行呈现，则可以使用此模板。下图显示的布局使用多个表行来显示数据源中的每项数据。下面的示例演示如何创建此布局。复制 asp:NumericPagerField ButtonCount=5 PreviousPageText= / asp:Label ID=FirstNameLabel runat=server Text= / asp:Label ID=LastNameLabel runat=server Text= / asp:Label ID=JobTitleLabel runat=server Text= / asp:HyperLink ID=EmailAddressLink runat=server Text= NavigateUrl= / asp:Label ID=PhoneLabel runat=server Text= / asp:Label ID=AddressLine1Label runat=server Text= / asp:Panel ID=AddressLine2Panel runat=server Visible= asp:Label ID=AddressLine2Label runat=server Text= / asp:Label ID=CityLabel runat=server Text= /, asp:Label ID=StateProvinceNameLabel runat=server Text= / asp:Label ID=PostalCodeLabel runat=server Text= / asp:Label ID=CountryRegionNameLabel runat=server Text= / 创建组模板下面的示例演示如何创建组模板。复制 asp:Label ID=NameLabel runat=server Text= / 若要按组显示各项，可以在 LayoutTemplate 模板中使用一个服务器控件来充当组的占位符。例如，可以使用 TableRow 控件。请将该占位符控件的 ID 属性设置为 groupPlaceholder。在运行时，该占位符控件将被 GroupTemplate 模板中的内容替换。随后，请再添加一个占位符控件，并将其 ID 属性设置为 itemPlaceholder。该控件只是其他模板（通常为 ItemTemplate 模板）的占位符。这样，该控件在运行时将被其他模板中的内容替换。该内容将重复 ListView 控件的 GroupItemCount 属性所指定的项次数。最后，请添加一个 ItemTemplate 模板，并提供要在每个项的包含控件内显示的数据绑定内容。注意通过为 GroupPlaceholderID 属性设置一个新值，可以更改用于标识组占位符的 ID 属性的值。使用 ItemSeparatorTemplate 模板可以指定各个项之间的分隔符。使用 GroupSeparatorTemplate 属性可以指定各个组之间的分隔符。下图显示的布局在每行中显示了数据源中的多个项。下面的示例演示如何创建此布局。复制 asp:NumericPagerField ButtonCount=3 PreviousPageText= / asp:Image ID=ProductImage runat=server ImageUrl= Height=49 / asp:HyperLink ID=ProductLink runat=server Target=_blank Text= NavigateUrl= / 返回页首对数据进行分页若要使用户能够按页查看 ListView 控件中的数据，可以使用 DataPager 控件。DataPager 控件可以位于 LayoutTemplate 模板内部，也可以位于 ListView 控件之外的页面上。如果 DataPager 控件不在 ListView 控件内，则必须将 PagedControlID 属性设置为 ListView 控件的 ID。DataPager 控件支持内置的分页用户界面。您可以使用 NumericPagerField 对象，此对象允许用户按页码选择数据页。此外也可以使用 NextPreviousPagerField 对象。利用此对象，用户可以逐页浏览数据页，也可以直接跳到第一个或最后一个数据页。默认情况下，如果用户在某个页上选择一个行，则将在每个页上选择此行。如果您只想为用户已选定的行（由此行的数据键标识）保持选择，则可以将 EnablePersistedSelection 属性设置为 true。数据页的大小由 DataPager 控件的 PageSize 属性设置。单个 DataPager 控件中可以使用一个或多个页导航字段对象。另外，通过使用 TemplatePagerField 对象，还可以创建自定义分页用户界面。在 TemplatePagerField 模板中，可以使用 Container 属性来引用 DataPager 控件。此属性可提供对 DataPager 控件的各个属性的访问。这些属性包括起始行索引、页面大小，以及当前绑定到 ListView 控件的总行数。下面的示例演示了一个在 ListView 控件的 LayoutTemplate 模板中包括的 DataPager 类。复制 asp:NumericPagerField ButtonCount=10 PreviousPageText= / 下图显示的布局使用 NumericPagerField 对象基于页码显示数据页的链接。下面的示例演示如何创建此布局。复制 PreviousPageText= 下图显示的分页用户界面使用 NextPreviousPagerField 对象显示下一个、上一个、第一个以及最后一个数据页的链接。分页用户界面还包括 TemplatePagerField 模板中的自定义内容，此模板用于显示当前的项编号范围以及总项数。TemplatePagerField 模板包含一个文本框，用户可以在其中输入要移到的项的编号。指定的项将显示为页面的第一项。下面的示例演示如何创建分页用户界面。复制   asp:TextBox ID=CurrentRowTextBox runat=server AutoPostBack=true Text= Columns=1 style=text-align:right OnTextChanged=CurrentRowTextBox_OnTextChanged / to asp:Label ID=PageSizeLabel runat=server Font-Bold=true Text= Container.TotalRowCount ? Container.TotalRowCount : Container.StartRowIndex + Container.PageSize % / of asp:Label ID=TotalRowsLabel runat=server Font-Bold=true Text= / asp:NextPreviousPagerField ShowFirstPageButton=true ShowLastPageButton=true FirstPageText=| NextPageText= PreviousPageText= 下面的示例演示了 TextBox 控件（包含在 TemplatePagerField 模板中）的 TextChanged 事件的事件处理程序。该处理程序中的代码会移至用户指定的数据项。VBC#C+F#JScript复制protected void CurrentRowTextBox_OnTextChanged(object sender, EventArgs e) TextBox t = (TextBox)sender; DataPager pager = (DataPager)EmployeesListView.FindControl(EmployeesDataPager); pager.SetPageProperties(Convert.ToInt32(t.Text) - 1, pager.PageSize, true);返回页首对数据进行排序通过在 LayoutTemplate 模板中添加一个按钮，并将该按钮的 CommandName 属性设置为“Sort”，可以对 ListView 控件中显示的数据进行排序。该按钮的 CommandArgument 属性应设置为要用作排序依据的列名。重复单击“Sort”（排序）按钮可在排序方向 Ascending 和 Descending 之间切换。在“Sort”（排序）按钮的 CommandArgument 属性中，可以指定多个列名。但是，ListView 控件会向整个列表的列应用该排序方向。因此，只有列表的最后一列会应用该排序方向。例如，如果 CommandArgument 包含“LastName, FirstName”，则重复单击“Sort”（排序）按钮会产生某种类似于“LastName, FirstName ASC”或“LastName, FirstName DESC”的表达式。下面的示例演示了一个 ListView 控件，它包含的“Sort”（排序）按钮将按姓氏对数据排序。复制 asp:NumericPagerField ButtonCount=10 PreviousPageText= / asp:Label runat=server ID=FirstNameLabel Text= asp:Label runat=server ID=LastNameLabel Text= 动态设置排序表达式通过动态设置 ListView 控件的排序表达式，可以创建自定义排序。若要执行此操作，请调用 Sort 方法或处理 Sorting 事件。下面的示例演示 Sorting 事件的处理程序。此代码将向 SortExpression 属性中的所有列应用同一排序方向。VBC#C+F#JScript复制protected void EmployeesListView_OnSorting(object sender, ListViewSortEventArgs e) if (String.IsNullOrEmpty(e.SortExpression) return; string direction = ; if (ViewStateSortDirection != null) direction = ViewStateSortDirection.ToString(); if (direction = ASC) direction = DESC; else direction = ASC; ViewStateSortDirection = direction; string sortColumns = e.SortExpression.Split(,); string sortExpression = sortColumns0 + + direction; for (int i = 1; i sortColumns.Length; i+) sortExpression += , + sortColumnsi + + direction; e.SortExpression = sortExpression;返回页首修改数据通过为 ListView 控件创建模板，可允许用户编辑、插入或删除单个数据项。若要使用户能够编辑数据项，可以向 ListView 控件添加一个 EditItemTemplate 模板。在将一个项切换至编辑模式时，ListView 控件将使用编辑模板显示该项。该模板应包含一些数据绑定控件，以便用户可以在其中编辑各个值。例如，该模板可以包含用户可以在其中编辑现有值的文本框。若要使用户能够插入新项，可以向 ListView 控件中添加一个 InsertItemTemplate 模板。与编辑模板一样，插入模板也应该包含允许输入数据的数据绑定控件。InsertItemTemplate 模板呈现在所显示项的开始或末尾。通过使用 ListView 控件的 InsertItemPosition 属性，可以指定 InsertItemTemplate 模板的呈现位置。通常需要向模板中添加一些按钮，以允许用户指定要执行的操作。例如，可以向项模板中添加“Delete”（删除）按钮，以允许用户删除该项。通过在模板中添加“Edit”（编辑）按钮，可允许用户切换到编辑模式。在 EditItemTemplate 中，可以添加允许用户保存更改的“Update”（更新）按钮。此外，还可以添加“Cancel”（取消）按钮，以允许用户在不保存更改的情况下切换回显示模式。通过设置按钮的 CommandName 属性，可以定义按钮将执行的操作。下表列出了一些 CommandName 属性值，ListView 控件已内置了针对这些值的行为。Select显示所选项的 SelectedItemTemplate 模板的内容。Insert在 InsertItemTemplate 模板中，指定应将数据绑定控件的内容保存在数据源中。Edit指定 ListView 控件应切换到编辑模式，并使用 EditItemTemplate 模板显示项。Update在 EditItemTemplate 模板中，指定应将数据绑定控件的内容保存在数据源中。Delete从数据源中删除项。Cancel取消当前操作。显示 EditItemTemplate 模板时，如果该项是当前选定的项，则取消操作会显示 SelectedItemTemplate 模板；否则将显示 ItemTemplate 模板。显示 InsertItemTemplate 模板时，取消操作将显示空的 InsertItemTemplate 模板。（自定义值）默认情况下，不执行任何操作。您可以为 CommandName 属性提供自定义值。随后可以在 ItemCommand 事件中测试该值并执行相应的操作。有关配置为允许执行编辑、删除和插入操作的 ListView 控件的示例，请参见演练：使用 ListView Web 服务器控件修改数据。返回页首对 ListView 项应用样式ListView 控件不支持 BackColor 和 Font 等样式属性。若要向 ListView 控件应用样式，必须对 ListView 模板中的各个控件应用级联样式表 (CSS) 类或内联样式元素。某些对象支持允许对输出元素设置样式的属性。例如，NumericPagerField 对象包括下列属性： NumericButtonCssClass 属性，可为用于按页码在数据页间移动的按钮指定 CSS 类名。 CurrentPageLabelCssClass 属性，可为当前页码指定 CSS 类名。 NextPreviousButtonCssClass 属性，可为用于移到数字按钮的下一个或上一个组的按钮指定 CSS 类名。返回页首类参考下表列出了与 ListView 控件相关的关键类。类说明ListView一个服务器控件，它使用用户定义的模板显示数据源的值。此控件可配置为允许用户选择、删除、编辑和插入记录，以及对记录进行排序。ListViewItem一个对象，表示 ListView 控件中的项。ListViewDataItem一个对象，表示 ListView 控件中的数据项。ListViewItemType一个枚举，用于标识 ListView 控件中各个项的功能。DataPager一个服务器控件，可为实现 IPageableItemContainer 接口的控件（例如 ListView 控件）提供分页功能。NumericPagerField一个 DataPager 字段，它允许用户按页码选择数据页。NextPreviousPagerField一个 DataPager 字段，它允许用户逐页浏览数据页，或者跳到第一个或最后一个数据页。TemplatePagerField一个 DataPager 字段，它允许用户创建自定义分页用户界面。返回页首代码示例以下部分包含使用 ListView 控件的代码示例。帮助和演练主题演练：使用 ListView Web 服务器控件对数据进行显示、分页和排序演练：使用 ListView Web 服务器控件修改数据返回页首请参见概念Visual Studio 和 ASP.NET 中的辅助功能ASP.NET 数据绑定 Web 服务器控件概述绑定到数据库数据源控件概述其他资源ASP.NET 全球化和本地化演练：使用 ListView Web 服务器控件对数据进行显示、分页和排序.NET Framework 4其他版本 Visual Studio 2008在本演练中，将使用 ListView 控件，在该控件中，可以按照用模板定义的格式来显示数据源的数据。通过使用模板，可以完全控制数据在控件中的布局和外观。ListView 控件自动支持编辑、插入和删除操作，以及排序和分页功能。本演练演示以下任务： 使用 ListView 控件显示数据库的数据。 向 ListView 控件添加分页功能。 向 ListView 控件添加排序功能。系统必备若要完成本演练，您需要： 在计算机上安装 Visual Studio 或 Visual Web Developer 速成版。注意如果使用 Visual Studio，则本演练假设您在首次启动 Visual Studio 时选择了“Web 开发”设置集合。有关更多信息，请参见如何：选择 Web 开发环境设置。 SQL Server Express。默认情况下，这会随 Visual Studio 或 Visual Web Developer 速成版一起安装。如果已经安装了 SQL Server，可以改用 SQL Server，但必须对某些过程进行一些小调整。 安装在您计算机上的 AdventureWorks 数据库。有关如何下载和安装 SQL Server 示例 AdventureWorks 数据库的信息，请参见 Microsoft SQL Server 网站上的 Installing Sample Databases for Express Editions（安装示例数据库）。 有权访问 AdventureWorks 数据库的 SQL Server 帐户的用户名和密码。创建网站如果已创建了一个网站（例如，通过完成演练：在 Visual Studio 中创建基本网页），则可以使用该网站并转到下一节。否则，请创建一个新网站和网页。本演练使用网站项目。您可以改用 Web 应用程序项目。有关这些 Web 项目类型之间的差异的信息，请参见 Web 应用程序项目与网站项目。创建文件系统网站1. 打开 Visual Studio 或 Visual Web Developer 速成版。2. 在“文件”菜单中单击“新建网站”。显示“新建网站”对话框。3. 在“已安装的模板”下，单击“Visual Basic”或“Visual C#”，然后选择“ASP.NET 网站”。4. 在“Web位置”框中，选择“文件系统”，然后输入用于保存网站页面的文件夹的名称。例如，键入文件夹名“C:WebSites”。5. 单击“确定”。Visual Studio 将创建一个包含预生成功能的网站项目，这些功能面向布局（母版页、Default.aspx 和 About.aspx 内容页以及级联样式表）、Ajax（客户端脚本文件）和身份验证（ASP.NET 成员资格）。在 ListView 控件中对显示数