将ASP.NET UpdatePanel控件与数据绑定控件一起使用

通过使用部分页呈现,可在支持 AJAX 的 ASP.NET 应用程序中创建更丰富的用户体验。 部分页呈现 可让您无需因回发而刷新整个页面, 而是可以指定仅要刷新的页面区域。 结果,用户在每次回发时将不 会再看到整个页面重新加载。

可使用 UpdatePanel 和 ScriptManager Web 服务器控件来启用部分页呈现。UpdatePanel 控件标识 可更新的页面区域。ScriptManager 控件跟踪页面上的 UpdatePanel 控件和触发要更新的 UpdatePanel 控件的控件。UpdatePanel 控件内导致回发的控件会自动标识为更新面板的触发器。还可以指定 UpdatePanel 控件外的控件。外部触发器可以是另一个 UpdatePanel 控件的子控件。

在一个页面上使用多个 UpdatePanel 控件

对于在一个页面上可以放置的 UpdatePanel 控件的数目没有限制。因此,可以指定独立于整个页面单 独刷新且相互独立的多个页面区域。

默认情况下,UpdatePanel 控件的 UpdateMode 属性设置为 Always。这意味着每当触发部分页刷新时 ,UpdatePanel 控件就会刷新页面,即使触发器不是针对该 UpdatePanel 控件的也是如此。若要确保 UpdatePanel 控件仅在已被触发时才刷新,可将 UpdatePanel 控件的 UpdateMode 属性设置为 Conditional。

下面的示例包括两个 UpdatePanel 控件。一个控件包含接受用户输入的 Web 控件,另一个控件显示 用户输入的内容。每个 UpdatePanel 控件的 UpdateMode 属性都设置为 Conditional 。因此,如果用 户单击“取消”按钮来清除输入窗体的字段,则仅刷新 UpdatePanel 控件的输入窗体。如果用户单击“ 插入”按钮以提交窗体,则两个 UpdatePanel 控件都会刷新。

<%@ Page Language="VB" %>
<%@ Import Namespace="System.Collections.Generic" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0  Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
   <title>Enter New Employees</title>
   <script runat="server">
     Private EmployeeList As List(Of Employee)

     Protected Sub Page_Load()
       If Not IsPostBack Then
         EmployeeList = New List(Of Employee)
         EmployeeList.Add(New Employee(1, "Jump", "Dan"))
         EmployeeList.Add(New Employee(2, "Kirwan", "Yvette"))
         ViewState("EmployeeList") = EmployeeList
       Else
         EmployeeList = CType(ViewState("EmployeeList"), List(Of Employee))
       End If

       EmployeesGridView.DataSource = EmployeeList
       EmployeesGridView.DataBind()
     End Sub

     Protected Sub InsertButton_Click(ByVal sender As Object, ByVal e As  EventArgs)
       If String.IsNullOrEmpty(FirstNameTextBox.Text) Or _
         String.IsNullOrEmpty(LastNameTextBox.Text) Then Return

       Dim employeeID As Integer = EmployeeList(EmployeeList.Count -  1).EmployeeID + 1

       Dim lastName As String = Server.HtmlEncode(FirstNameTextBox.Text)
       Dim firstName As String = Server.HtmlEncode(LastNameTextBox.Text)

       FirstNameTextBox.Text = String.Empty
       LastNameTextBox.Text = String.Empty

       EmployeeList.Add(New Employee(employeeID, lastName, firstName))
       ViewState("EmployeeList") = EmployeeList

       EmployeesGridView.DataBind()
       EmployeesGridView.PageIndex = EmployeesGridView.PageCount
     End Sub

     Protected Sub CancelButton_Click(ByVal sender As Object, ByVal e As  EventArgs)
       FirstNameTextBox.Text = String.Empty
       LastNameTextBox.Text = String.Empty
     End Sub

     <Serializable()> _
     Public Class Employee
       Private _employeeID As Integer
       Private _lastName As String
       Private _firstName As String

       Public ReadOnly Property EmployeeID() As Integer
         Get
           Return _employeeID
         End Get
       End Property

       Public ReadOnly Property LastName() As String
         Get
           Return _lastName
         End Get
       End Property

       Public ReadOnly Property FirstName() As String
         Get
           Return _firstName
         End Get
       End Property

       Public Sub New(ByVal employeeID As Integer, ByVal lastName As  String, ByVal firstName As String)
         _employeeID = employeeID
         _lastName = lastName
         _firstName = firstName
       End Sub
     End Class

   </script>
</head>
<body>
   <form id="form1" runat="server">
   <div>
     &nbsp;</div>
     <asp:ScriptManager ID="ScriptManager1" runat="server"  EnablePartialRendering="true" />
     <table>
       <tr>
         <td style="height: 206px" valign="top">
           <asp:UpdatePanel ID="InsertEmployeeUpdatePanel" runat="server"  UpdateMode="Conditional">
             <ContentTemplate>
              <table cellpadding="2" border="0" style="background-color:#7C6F57">
               <tr>
                <td><asp:Label ID="FirstNameLabel" runat="server"  AssociatedControlID="FirstNameTextBox"
                        Text="First Name"  ForeColor="White" /></td>
                <td><asp:TextBox runat="server" ID="FirstNameTextBox" /></td>
               </tr>
               <tr>
                <td><asp:Label ID="LastNameLabel" runat="server"  AssociatedControlID="LastNameTextBox"
                        Text="Last Name"  ForeColor="White" /></td>
                <td><asp:TextBox runat="server" ID="LastNameTextBox" /></td>
               </tr>
               <tr>
                <td></td>
                <td>
                 <asp:LinkButton ID="InsertButton" runat="server" Text="Insert"  OnClick="InsertButton_Click" ForeColor="White" />
                 <asp:LinkButton ID="Cancelbutton" runat="server" Text="Cancel"  OnClick="CancelButton_Click" ForeColor="White" />
                </td>
               </tr>
              </table>
              <asp:Label runat="server" ID="InputTimeLabel"><%=DateTime.Now % ></asp:Label>
             </ContentTemplate>
           </asp:UpdatePanel>
         </td>
         <td style="height: 206px" valign="top">
           <asp:UpdatePanel ID="EmployeesUpdatePanel" runat="server"  UpdateMode="Conditional">
             <ContentTemplate>
               <asp:GridView ID="EmployeesGridView" runat="server" BackColor="LightGoldenrodYellow"  BorderColor="Tan"
                 BorderWidth="1px" CellPadding="2" ForeColor="Black"  GridLines="None" AutoGenerateColumns="False">
                 <FooterStyle BackColor="Tan" />
                 <SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
                 <PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue"  HorizontalAlign="Center" />
                 <HeaderStyle BackColor="Tan" Font-Bold="True" />
                 <AlternatingRowStyle BackColor="PaleGoldenrod" />
                 <Columns>
                   <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" />
                   <asp:BoundField DataField="LastName" HeaderText="Last Name" />
                   <asp:BoundField DataField="FirstName" HeaderText="First Name" />
                 </Columns>
                 <PagerSettings PageButtonCount="5" />
               </asp:GridView>
               <asp:Label runat="server" ID="ListTimeLabel"><%=DateTime.Now % ></asp:Label>
             </ContentTemplate>
             <Triggers>
               <asp:AsyncPostBackTrigger ControlID="InsertButton" EventName="Click" />
             </Triggers>
           </asp:UpdatePanel>
         </td>
       </tr>
     </table>
   </form>
</body>
</html>

时间: 2024-10-26 16:26:17

将ASP.NET UpdatePanel控件与数据绑定控件一起使用的相关文章

ASP.NET 2.0 和数据绑定控件:新的角度,新的做法

asp.net|控件|数据 适用于:Microsoft ASP.NET 1.xMicrosoft ASP.NET 2.0 摘要:了解 ASP.NET 2.0 中的用于生成自定义数据绑定控件的工具是如何演变的.   本页内容 为什么需要新的数据源模型  ASP.NET 2.0 中的数据绑定控件  分析要点  数据绑定机制   列表控件  HeadlineList 示例控件  管理自定义集合  关于复合控件的一点讨论  小结 为什么需要新的数据源模型数据绑定是开发人员在 ASP.NET 1.x 中发

非常ASP.NET: 您将需要用到的独有数据绑定控件

随 Visual Studio 2008 一同发布的 ASP.NET 3.5 引入了新的数据绑定控件-ListView. 我知道您正在想什么:为什么 ASP.NET 里还需要另一个数据绑定控件呢?毕竟,当显示数据收集时,我们 已经有超过 10 个控件可供选择,其中包括逐渐不再使用的 DataGrid.新的和改进的 GridView.非常可 靠和简单的 Repeater.独特和灵活的 DataList.方便的 FormView 及其稍显冗余的同行 DetailsView. 当然,还有一维列表控件

asp.net夜话之八:数据绑定控件(一)

通过前面的例子我们看到每次我们要显示数据的时候都要通过一个循环来显示满足条件的数据,这是一个比较麻烦的过程,为此微软定义了一系列的控件专门用于显示数据的格式,通过这些控件可以以可视化的方式查看绑定数据之后的效果.这些控件称之为数据绑定控件.在asp.net中所有的数据库绑定控件都是从BaseDataBoundControl这个抽象类派生的,这个抽象类定义了几个重要属性和一个重要方法: DataSource属性:指定数据绑定控件的数据来源,显示的时候程序将会从这个数据源中获取数据并显示. Data

asp.net学习之 数据绑定控件--表格绑定控件

原文:asp.net学习之 数据绑定控件--表格绑定控件     数据绑定 Web 服务器控件是指可绑定到数据源控件,以实现在 Web 应用程序中轻松显示和修改数据的控件.数据绑定 Web 服务器控件是将其他 ASP.NET Web 控件(例如 Label 和 TextBox 控件)组合到单个布局中的复合控件.     例如,诸如 DetailsView 控件等数据绑定控件可绑定到一个结果集,例如,包含每个雇员的姓名.地址.职务等信息的雇员表.在 DetailsView 控件中,可以将 Labe

将ASP.NET UpdatePanel控件与用户控件一起使用

可以像为网页上的其他控件启用部分页更新一样为用户控件启用部分页更新.必须向页添加 ScriptManager 控件,并将其 EnablePartialRendering 属性设置为 true.ScriptManager 控件将管理 UpdatePanel 控件的部分页更新,这些控件直接位于 ASP.NET 网页上或位于页上的用户控件内. 在一个简单的方案中,可以将用户控件置于更新面板内,当对更新面板的内容进行更新时,将刷新这 些用户控件.也可以将 UpdatePanel 控件置于用户控件内,从而

自定义ASP.NET UpdatePanel控件的错误处理

先决条件 若要在您自己的开发环境中实现这些过程,您需要: Microsoft Visual Studio 2005 或 Microsoft Visual Web Developer 速成版. 一个支持 AJAX 的 ASP.NET 网站. 在服务器代码中自定义错误处理 首先,您将通过使用页面中的服务器代码自定义错误处理. 在服务器代码中自定义错误处理 创建新页并切换到"设计"视图. 在工具箱的"AJAX Extensions"选项卡中,双击 ScriptManage

绑定Enum到ASP.NET数据绑定控件的完美解决方案

本文向读者介绍NBear中实现的DropDownListField字段绑定控件和EnumDescriptionAttribute特性.结合使用这两个组件,就可以最简单.易用和可扩展地完美解决绑定Enum到ASP.NET数据绑定控件的问题.[05/26修订]--增加支持第三方枚举描述,支持二进制与过的枚举值. 从DropDownListField的名称,大家一定猜到了,是的,DropDownListField控件和ASP.NET内置的BoundField,CheckBoxField等一样,可以直接

asp.net学习之数据绑定控件、数据源控件概述

原文:asp.net学习之数据绑定控件.数据源控件概述 1.asp.net数据绑定控件分为三大类,每个类分别进行详细:      ● 列表式数据绑定控件: 列表式数据绑定控件常用来在一个表格内的一个字段进行绑定.显示一个字段下所有数据的信息.           它包括以下几个控件:BulletedList.CheckboxList.DropDownList.ListBox.RadioButtonList           具体的参照以下文章:  http://www.cnblogs.com/

浅谈ASP.NET常用数据绑定控件优劣总结_实用技巧

本文的初衷在于对Asp.net常用数据绑定控件进行一个概览性的总结,主要分析各种数据绑定控件各自的优缺点,以便在实际的开发中选用合适的控件进行数据绑定,以提高开发效率. 因为这些数据绑定控件大部分都已经封装的很好了,稍微有一些基础的朋友都可以很容易的上手使用,所以本文不涉及具体控件的使用,只在于分析各自的优劣点,但是在下一篇文章里,我会主要讲一下ListBox.GridView.Repeater这三个数据绑定控件的"高效分页",ListBox和GridView内置的有分页,但是其效率太