|
|
下面是一個完整的UpdatePanel的結(jié)構(gòu)：
復制代碼 代碼如下:
<ASP:ScriptManager ID="ScriptManager1" runat="server" >
</ASP:ScriptManager>
<ASP:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true" UpdateMode="Always" RenderMode="Block">
<ContentTemplate>
</ContentTemplate>
<Triggers>
<ASP:AsyncPostBackTrigger />
<ASP:PostBackTrigger />
</Triggers>
</ASP:UpdatePanel>
主要屬性：
1，ChildrenAsTriggers : 內(nèi)容模板內(nèi)的子控件的回發(fā)是否更新本模板(和UpdateMode的conditional有關)
2，UpdateMode : 內(nèi)容模板的更新模式，有always和conditional倆種
always：每次ajax PostBack或者普通的PostBack都能引起panel的更新 如果UpdatePanel設置為Always時，不能使用上面的ChildrenAsTriggers屬性，強行使用會報錯，是updatepanel默認的更新模式,和設置trigger觸發(fā)器沒有直接的關系。
conditional：只有滿足如下某一條件時才更新panel的內(nèi)容
如果設置UpdateMode="conditional" ChildrenAsTriggers="false"時候，子控件不允許觸發(fā)更新
1)，當panel中的某個控件引發(fā)PostBack時
2), 當Panel指定的某個Trigger被引發(fā)時
3，RenderMode： 局部更新控件的呈現(xiàn)形式，倆中，Block(局部更新在客戶端以div形式展現(xiàn))和Inline(局部更新以span的形式展現(xiàn)在客戶端)
子元素：
1,contentTemplate: 局部更新控件的內(nèi)容模板，可以在其中添加任何控件
2，Triggers: 局部更新的觸發(fā)器，包括倆中：異步回發(fā)(AsyncPostBackTrigger) 用來實現(xiàn)局部更新。普通回發(fā)(PostBackTrigger)和普通的一養(yǎng)，不管是否使用了局部更新控件，都會引起頁面的全部更新。
下面是幾個簡單的例子：
1,updatepanel的updatemode設置為always
復制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.ASPx.cs" Inherits="Default2" %>
<!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 runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<ASP:ScriptManager ID="ScriptManager1" runat="server">
</ASP:ScriptManager>
<ASP:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<% =DateTime.Now.ToString()%>
<ASP:Button ID="Button1" runat="server" Text="UpdatePanelButton" />
</ContentTemplate>
</ASP:UpdatePanel>
<ASP:Button ID="Button2" runat="server" Text="Button" />
</form>
</body>
</html>
不管哪個按鈕，都會觸發(fā)更新，只不過外面的按鈕postback的時候頁面顯示回發(fā)而已 ！
1,updatepanel的updatemode設置為conditional( ChildrenTriggers="false" 就是updatepanel中事件不觸發(fā)更新)
復制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.ASPx.cs" Inherits="Default2" %>
<!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 runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<ASP:ScriptManager ID="ScriptManager1" runat="server">
</ASP:ScriptManager>
<ASP:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<% =DateTime.Now.ToString()%>
<ASP:Button ID="Button1" runat="server" Text="UpdatePanelButton" />
</ContentTemplate>
</ASP:UpdatePanel>
<ASP:Button ID="Button2" runat="server" Text="Button" />
</form>
</body>
</html>
下面介紹下updatePanel的觸發(fā)器Trigger
了解數(shù)據(jù)庫的人應該對觸發(fā)器這個概念比較清楚，Trigger對于UpdatePanel來說也是很關鍵的
開始簡單介紹了UpdatePanel的倆中觸發(fā)器asyncPostBackTrigger和PostBackTrigger的作用
這里用例子大概在稍微深入地介紹下：
1,普通回調(diào)觸發(fā)器(PostBackTrigger)
PostBackTrigger主要針對UpdatePanel模板內(nèi)的子控件，因為當子控件被觸發(fā)時。它只會更新模版內(nèi)的數(shù)據(jù)，模板外的控件不會發(fā)生變化.當需要更新全局 內(nèi)容的時候就可以通過PostBackTrigger觸發(fā)器來實現(xiàn)頁面的全部回調(diào)。
下面是簡單例子：
復制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.ASPx.cs" Inherits="Default2" %>
<!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 runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<ASP:ScriptManager ID="ScriptManager1" runat="server">
</ASP:ScriptManager>
<ASP:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<% =DateTime.Now.ToString()%>
<ASP:Button ID="Button1" runat="server" Text="UpdatePanelButton" />
</ContentTemplate>
<Triggers>
<!--下面的注釋掉，點擊updatePanel內(nèi)的button則只更新Panel內(nèi)的時間，取消注釋責全部更新-->
<!-- <ASP:PostBackTrigger ControlID="Button1"/>-->
</Triggers>
</ASP:UpdatePanel>
<br />
<% =DateTime.Now.ToString()%>
<ASP:Button ID="Button2" runat="server" Text="Button" />
</form>
</body>
</html>
2，異步回調(diào)觸發(fā)器(AsyncPostBackTrigger)
是實現(xiàn)局部更新的關鍵，在觸發(fā)器內(nèi)定義引起回發(fā)的控件和事件
例：
復制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.ASPx.cs" Inherits="Default2" %>
<!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 runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<ASP:ScriptManager ID="ScriptManager1" runat="server">
</ASP:ScriptManager>
<ASP:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<% =DateTime.Now.ToString()%>
</ContentTemplate>
<Triggers>
<ASP:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
</Triggers>
</ASP:UpdatePanel>
<br />
<% =DateTime.Now.ToString()%>
<ASP:Button ID="Button2" runat="server" Text="Button" />
</form>
</body>
</html>
運行了發(fā)現(xiàn)點擊button2的時候只更新了 updatepanel內(nèi)部的時間
上面的例子也可以動態(tài)更新UpdatePanel的一些源代碼：
具體例子就不寫了下面 大概寫點主要代碼：
復制代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
//獲取更新控件兒
UpdatePanel mapanel = UpdatePanel1;
//設置觸發(fā)模式
mapanel.UpdateMode = UpdatePanelUpdateMode.Conditional;
//顯示時間
Label1.Text = DateTime.Now.ToString();
//添加觸發(fā)
AsyncPostBackTrigger tri = new AsyncPostBackTrigger();
tri.ControlID = "Button2";
tri.EventName = "Click";
mapanel.Triggers.Add(tri);
}
先記錄這些~還望多多大蝦們多多指教
AspNet技術(shù)：asp.net UpdatePanel的簡單用法，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
