ASP.NET AJAX:需要state-技术开发专区

ASP.NET AJAX:需要state

作者：IT168 微山编辑：胡铭娅 2007-10-30 00:00

绪论

    在这篇文章中，我们将研究两个可能的方案的其中之一，当使用ASP.NET AJAX（异步JavaScript 和XML）结构时，不管有没有要求使用state，都会发现自己在这两个可能的方案之中。

需不需要state？

    ASP.NET中可以使用并且创建控件，这些控件在超文本传输协议请求时能保持它们的状态。使用状态的一个最好的控件就是GridView控件。GridView有一个浏览状态和编辑状态，如果你使过滤和页面调度成为可能的话，甚至你能拥有更多的状态.在ASP.NET中，控件的状态靠ViewState属性来维持。ViewState允许我们在超文本传输协议请求时保持控件的值，保持一个桌面应用程序的同一用户端口的一致性。

当我们需要state

    前面已经说明：GridView是一个有多个状态的控件的好例子，调用每一个特殊的状态需要服务器的完全回传，此服务器通过引人注目的屏幕闪烁，打破了应用程序同一用户端口的一致性。

   引进了ASP.NET AJAX（以前称为Atlas）后，与带有Postback 的服务器相连接的屏幕闪烁通常通过引进UpdatePanel来解决。以高标准的视角，你可以认为UpdatePanel——为UpdatePanel控件中预先包装了的内容提供异步更新。

    需要注意的是：使用UpdatePanel仍然会导致服务器的完全回传，就像我们没有使用UpdatePanel一样，它也会导致服务器的完全回传。UpdatePanel的优点就是：它能保持Page事件模式，因此我们可以从UpdatePanel中，被包装的控件中发起事件，从数据的异步运行中得到好处。让我们来看一下在UpdatePanel中使用GridView的情况，确定服务器要求什么数据。

代码1: 在UpdatePanel中使用GridView

Collapse 
<asp:ScriptManager 
ID="sm" 
runat="server" /> 

<asp:UpdatePanel 
ID="upGv" 
runat="server"> 
<ContentTemplate> 
<asp:GridView 
ID="gvPeople" 
runat="server" 
AllowPaging="True" 
AllowSorting="True" 
AutoGenerateColumns="False" 
DataKeyNames="personid" 
DataSourceID="odsPeople" 
Width="400px"> 
<Columns> 
<asp:CommandField 
ShowEditButton="True" /> 
<asp:CommandField 
ShowDeleteButton="true" /> 
<asp:BoundField 
DataField="firstname" 
HeaderText="First Name" 
SortExpression="firstname" /> 
<asp:BoundField 
DataField="lastname" 
HeaderText="Last Name" 
SortExpression="lastname" /> 
</Columns> 
</asp:GridView> 
</ContentTemplate> 
</asp:UpdatePanel>

   在代码1中描述了UpdatePanels内容模版因素中的GridView控件——要从GridViews内容的异步更新中得到好处时必须做这些事情。

    在图1中要解释一个关键的部件，那就是ScriptManager控件，这就像是在ASP.NET AJAX后面的大脑一样——它决定了为了使AJAX功能在客户浏览器(IE, Safari, Firefox, Mozilla,等等)上运行，客户要下载什么样的脚本。

    如果运行图1中的代码，将看不到屏幕闪烁,然而更重要的是当我们给数据标页码时服务器所需要的内容。在图2中看到一些数据，这些数据是当我们浏览GridView控件中另一页数据时，客户所要求的数据。响应的第一行（887 | updatePanel | upGv）告诉我们：UpdatePanel控件中被更新的内容的整个大小是887字节，被连接起来的UpatePanel的ID是upGv。当继续看返回到客户的内容时可以发现只有GridView里被更新的HTML代码被返回到了客户，UpdatePanel以外的页码上面的任何其它项目都没有被重新下载。

图 1: GridView控件客户端需要的数据

    因为我们向服务器发送异步要求，因此我们要处理等待时间问题。在AJAX中，等待时间是我们必需要考虑的主要因素，当用户创建某些事情时，我们必须告诉用户那个请求的进展情况——记住用户即将经历的等待时间因我们服务器所承受的压力不同而不同。

    伴随着UpdateProgress控件的ASP.NET AJAX允许以一种友好的态度告诉用户——请求已经成功创建了，请求正在运行。当请求完成时，我们预先确定的信息也消失了。

    接下来看看代码2中的例子，此例子与图1中的一样，但是补充了一个UpdateProgress控件。

    代码2: 使用 UpdateProgress 控件

Collapse 
<asp:ScriptManager 
ID="sm" 
runat="server" /> 

<asp:UpdatePanel 
ID="upGv" 
runat="server"> 
<ContentTemplate> 
<asp:GridView 
ID="gvPeople" 
runat="server" 
AllowPaging="True" 
AllowSorting="True" 
AutoGenerateColumns="False" 
DataKeyNames="personid" 
DataSourceID="odsPeople" 
Width="400px"> 
<Columns> 
<asp:CommandField 
ShowEditButton="True" /> 
<asp:CommandField 
ShowDeleteButton="true" /> 
<asp:BoundField 
DataField="firstname" 
HeaderText="First Name" 
SortExpression="firstname" /> 
<asp:BoundField 
DataField="lastname" 
HeaderText="Last Name" 
SortExpression="lastname" /> 
</Columns> 
</asp:GridView> 
</ContentTemplate> 
</asp:UpdatePanel> 

<asp:UpdateProgress 
ID="upProgGv" 
runat="server"> 
<ProgressTemplate> 
<p>Please wait Loading...</p> 
</ProgressTemplate> 
</asp:UpdateProgress>

在代码2中可以看到定义UpdateProgress控件非常简单，用户友好信息在UpdateProgress控件的ProgressTemplate元素中运行——正因为这样，我们已经有效地处理了由GridView引起的异步请求的响应时间问题。

多控件和 UpdatePanel控件

到目前为止已经为单个UpdatePanel控件里的单控件写了地址，同时我们将使用由UpdatePanel提供的多个控件的异步行为。执行这一功能非常简单，最好的方法就是在本地把用户端口分成几个小功能，然后给每一个小功能指定一个UpdatePanel。
接着看一下代码3，这个例子在同一页码上有一个GridView 和一个 FormView，每一个GridView 和 FormView都有自己的UpdatePanel 和 UpdateProgress控件。

代码3: Multiple UpdatePanel’s

Collapse 
<asp:ScriptManager 
ID="sm" 
runat="server" /> 

<asp:UpdatePanel 
ID="upGv" 
runat="server"> 
<ContentTemplate> 
<asp:GridView 
ID="gvPeople" 
runat="server" 
AllowPaging="True" 
AllowSorting="True" 
AutoGenerateColumns="False" 
DataKeyNames="personid" 
DataSourceID="odsPeople" 
Width="400px"> 
<Columns> 
<asp:CommandField 
ShowEditButton="True" /> 
<asp:CommandField 
ShowDeleteButton="true" /> 
<asp:BoundField 
DataField="firstname" 
HeaderText="First Name" 
SortExpression="firstname" /> 
<asp:BoundField 
DataField="lastname" 
HeaderText="Last Name" 
SortExpression="lastname" /> 
</Columns> 
</asp:GridView> 
</ContentTemplate> 
</asp:UpdatePanel> 

<asp:UpdateProgress 
ID="upProgGv" 
runat="server" 
AssociatedUpdatePanelID="upGv"> 
<ProgressTemplate> 
<p>Please wait Loading...</p> 
</ProgressTemplate> 
</asp:UpdateProgress> 

<asp:UpdatePanel 
ID="upFv" 
runat="server"> 
<ContentTemplate> 
<asp:FormView 
ID="fvPerson" 
runat="server" 
DataSourceID="odsPeople" 
DefaultMode="Insert"> 
<InsertItemTemplate> 
<asp:TextBox 
ID="txtFirstName" 
Text='<%# Bind("firstname") %>' 
runat="server" /> 
<asp:TextBox 
ID="txtLastName" 
Text='<%# Bind("lastname") %>' 
runat="server" /> 
<asp:LinkButton 
ID="lbInsert" 
CommandName="Insert" 
Text="Add Person" 
runat="server" /> 
<asp:LinkButton 
ID="lbCancel" 
CommandName="Cancel" 
Text="Cancel" 
runat="server" /> 
</InsertItemTemplate> 
</asp:FormView> 
</ContentTemplate> 
</asp:UpdatePanel> 

<asp:UpdateProgress 
ID="upProgFv" 
runat="server" 
AssociatedUpdatePanelID="upFv"> 
<ProgressTemplate> 
<p>Adding Person Please wait...</p> 
</ProgressTemplate> 
</asp:UpdateProgress>

关注我们