UpdatePanel控件也是Ajax里用得最多的控件之中的一個，UpdatePanel控件是用來局部更新網(wǎng)頁上的內(nèi)容，網(wǎng)頁上要局部更新的內(nèi)容必須放在UpdatePanel控件里，他必須和上一次說的
ScriptManager控件一起使用。如今來看
UpdatePanel的屬性
指定Button2實(shí)現(xiàn)整頁更新。
.CS代碼為：
?
protected
?
void
?Button1_Click1(
object
?sender,?EventArgs?e)
????
{
??
????????SqlConnection?conn?
=
?
new
?SqlConnection(
"
server=.;uid=sa;pwd=;database=pubs
"
);
????????
string
?sql1?
=
?
"
select?top?5?au_lname?from?authors?
"
;
????????SqlDataAdapter?myAdapter?
=
?
new
?SqlDataAdapter(sql1,?conn);
????????DataSet?ds?
=
?
new
?DataSet();
????????myAdapter.Fill(ds,?
"
bieminG
"
);
????????
//
來自web?service的dataset,這里隨便一個ds就能夠;
????????
this
.GridView1.DataSource?
=
?ds.Tables[
"
bieminG
"
].DefaultView;?;
????????
this
.GridView1.DataBind();?
//
數(shù)據(jù)綁定
????}
????
protected
?
void
?Button2_Click(
object
?sender,?EventArgs?e)
????
{
????????
this
.Label1.Text?
=
?
"
11111
"
;
????}
Button1實(shí)現(xiàn)一個數(shù)據(jù)集的異步更新，BUTTON2就是一般的賦值了。看看是不是非常easy呀！呵呵！ ?
UpdatePanel
重要的屬性例如以下：
|
屬性
|
說明
|
|
ChildrenAsTriggers
|
當(dāng)UpdateMode屬性為Conditional時，UpdatePanel中的子控件的異步回送是否會引發(fā)UpdatePanle的更新。
|
|
RenderMode
|
表示UpdatePanel終于呈現(xiàn)的HTML元素。Block（默認(rèn)）表示<div>，Inline表示<span>
|
|
UpdateMode
|
表示UpdatePanel的更新模式，有兩個選項(xiàng)：Always和Conditional。Always是無論有沒有Trigger，其它控件都將更新該UpdatePanel，Conditional表示僅僅有當(dāng)前UpdatePanel的Trigger，或ChildrenAsTriggers屬性為true時當(dāng)前UpdatePanel中控件引發(fā)的異步回送或者整頁回送，或是server端調(diào)用Update()方法才會引發(fā)更新該UpdatePanel。
|
ChildrenAsTriggers：
當(dāng)UpdateMode屬性為Conditional時，UpdatePanel中的子控件的異步回送是否會引發(fā)UpdatePanle的更新。
里面包括了一個Triggers,里面第一個屬性
AsyncPostBackTrigger指定Button1實(shí)現(xiàn)異步更新，而
PostBackTrigger
RenderMode:
表示UpdatePanel終于呈現(xiàn)的HTML元素。Block（默認(rèn)）表示<div>，Inline表示<span>
<%
@?Page?Language
=
"
C#
"
?AutoEventWireup
=
"
true
"
?CodeFile
=
"
Default.aspx.cs
"
?Inherits
=
"
_Default
"
?
%>
<!
DOCTYPE?html?PUBLIC?
"
-//W3C//DTD?XHTML?1.1//EN
"
?
"
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd
"
>
<
html?xmlns
=
"
http://www.w3.org/1999/xhtml
"
>
<
head?runat
=
"
server
"
>
????
<
title
>
Untitled?Page
</
title
>
????
<
style?type
=
"
text/css
"
>
?????????body?
{?background
-
attachment:
fixed
;
?????????????
??????????????
????????????????background
-
image:url(Blue?hills.jpg);
????????????????}
????????????????
?????????.style1
?????????
{
????????????????background
-
position:top?center;
?????????}
?????????
?????????
????
</
style
>
</
head
>
<
body??onload
=
"
oSpan.className='style1'
"
?
>
????
<
form?id
=
"
form1
"
?runat
=
"
server
"
>
????
<
span?style
=
"
font-size:14;?width:250;
"
?ID
=
"
oSpan
"
????????onmouseover
=
"
this.className='style2'
"
?onmouseout
=
"
this.className='style1'
"
></
span
>
????????
<
div
>
????????????
<
asp:ScriptManager?ID
=
"
ScriptManager1
"
?????runat
=
"
server
"
>
????
??????????????
</
asp:ScriptManager
>
????????
</
div
>
???????????
????????
<
asp:UpdatePanel?ID
=
"
uid
"
??runat
=
"
server
"
>
????????
????????????
<
ContentTemplate
>
????????????
????????????????
<
div?
>
????????????????????
<
asp:Button?ID
=
"
Button1
"
?runat
=
"
server
"
?Text
=
"
異步回送
"
?OnClick
=
"
Button1_Click1
"
?
/>&
nbsp;
&
nbsp;
????????????????????
<
asp:Button?ID
=
"
Button2
"
?runat
=
"
server
"
?Text
=
"
整頁回送
"
?OnClick
=
"
Button2_Click
"
?
/><
br?
/>
????????????????????
<
asp:GridView?ID
=
"
GridView1
"
?runat
=
"
server
"
?AutoGenerateColumns
=
"
False
"
?Width
=
"
197px
"
>
????????????????????????
<
Columns
>
????????????????????????????
<
asp:BoundField?DataField
=
"
au_lname
"
?FooterText
=
"
aaaa
"
?HeaderText
=
"
au_lname
"
?
/>
????????????????????????
</
Columns
>
????????????????????
</
asp:GridView
>
????????????????????
<
br?
/>
???????????????????
<
asp:Label?ID
=
"
Label1
"
?runat
=
"
server
"
?Text
=
"
當(dāng)前時間
"
?Font
-
Bold
=
"
True
"
?Font
-
Size
=
"
Large
"
></
asp:Label
>
??????????????????
</
div
>
????????????
</
ContentTemplate
>
????????????
<
Triggers
>
????????????????
<
asp:AsyncPostBackTrigger????ControlID
=
"
Button1
"
?
/>
????????????????
<
asp:PostBackTrigger??ControlID
=
"
Button2
"
?
/>
????????????
</
Triggers
>
??????????????
????????
</
asp:UpdatePanel
>
??????????
<
div?id
=
"
div1
"
?
>
??????????????
&
nbsp;
</
div
>
????????
????????
????
</
form
>
</
body
>
</
html
>
UpdateMode：
表示UpdatePanel的更新模式，有兩個選項(xiàng)：Always和Conditional。Always是無論有沒有Trigger，其它控件都將更新該UpdatePanel，Conditional表示僅僅有當(dāng)前UpdatePanel的Trigger，或ChildrenAsTriggers屬性為true時當(dāng)前UpdatePanel中控件引發(fā)的異步回送或者整頁回送，或是server端調(diào)用Update()方法才會引發(fā)更新該UpdatePanel。
Contente Template：用來定義UpdatePanel的內(nèi)容
Triggers：分別為AsyncPostBackTrigger和PostBackTrigger
AsyncPostBackTrigge用來指定某個server端控件以及其將觸發(fā)的server端事件作為該UpdatePanel的異步更新觸發(fā)器，它須要設(shè)置的屬性有控件ID和服務(wù)端控件的事件；PostBackTrigger用來指定在UpdatePanel中的某個服務(wù)端控件，它所引發(fā)的回送不使用異步回送，而仍然是傳統(tǒng)的整頁回送
如今我們來做一個簡單的實(shí)例：
Contente Template：用來定義UpdatePanel的內(nèi)容
Triggers：分別為AsyncPostBackTrigger和PostBackTrigger
AsyncPostBackTrigge用來指定某個server端控件以及其將觸發(fā)的server端事件作為該UpdatePanel的異步更新觸發(fā)器，它須要設(shè)置的屬性有控件ID和服務(wù)端控件的事件；PostBackTrigger用來指定在UpdatePanel中的某個服務(wù)端控件，它所引發(fā)的回送不使用異步回送，而仍然是傳統(tǒng)的整頁回送
如今我們來做一個簡單的實(shí)例：
<%
@?Page?Language
=
"
C#
"
?AutoEventWireup
=
"
true
"
?CodeFile
=
"
Default.aspx.cs
"
?Inherits
=
"
_Default
"
?
%>
<!
DOCTYPE?html?PUBLIC?
"
-//W3C//DTD?XHTML?1.1//EN
"
?
"
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd
"
>
<
html?xmlns
=
"
http://www.w3.org/1999/xhtml
"
>
<
head?runat
=
"
server
"
>
????
<
title
>
Untitled?Page
</
title
>
????
<
style?type
=
"
text/css
"
>
?????????body?
{?background
-
attachment:
fixed
;
?????????????
??????????????
????????????????background
-
image:url(Blue?hills.jpg);
????????????????}
????????????????
?????????.style1
?????????
{
????????????????background
-
position:top?center;
?????????}
?????????
?????????
????
</
style
>
</
head
>
<
body??onload
=
"
oSpan.className='style1'
"
?
>
????
<
form?id
=
"
form1
"
?runat
=
"
server
"
>
????
<
span?style
=
"
font-size:14;?width:250;
"
?ID
=
"
oSpan
"
????????onmouseover
=
"
this.className='style2'
"
?onmouseout
=
"
this.className='style1'
"
></
span
>
????????
<
div
>
????????????
<
asp:ScriptManager?ID
=
"
ScriptManager1
"
?????runat
=
"
server
"
>
????
??????????????
</
asp:ScriptManager
>
????????
</
div
>
???????????
????????
<
asp:UpdatePanel?ID
=
"
uid
"
??runat
=
"
server
"
>
????????
????????????
<
ContentTemplate
>
????????????
????????????????
<
div?
>
????????????????????
<
asp:Button?ID
=
"
Button1
"
?runat
=
"
server
"
?Text
=
"
異步回送
"
?OnClick
=
"
Button1_Click1
"
?
/>&
nbsp;
&
nbsp;
????????????????????
<
asp:Button?ID
=
"
Button2
"
?runat
=
"
server
"
?Text
=
"
整頁回送
"
?OnClick
=
"
Button2_Click
"
?
/><
br?
/>
????????????????????
<
asp:GridView?ID
=
"
GridView1
"
?runat
=
"
server
"
?AutoGenerateColumns
=
"
False
"
?Width
=
"
197px
"
>
????????????????????????
<
Columns
>
????????????????????????????
<
asp:BoundField?DataField
=
"
au_lname
"
?FooterText
=
"
aaaa
"
?HeaderText
=
"
au_lname
"
?
/>
????????????????????????
</
Columns
>
????????????????????
</
asp:GridView
>
????????????????????
<
br?
/>
???????????????????
<
asp:Label?ID
=
"
Label1
"
?runat
=
"
server
"
?Text
=
"
當(dāng)前時間
"
?Font
-
Bold
=
"
True
"
?Font
-
Size
=
"
Large
"
></
asp:Label
>
??????????????????
</
div
>
????????????
</
ContentTemplate
>
????????????
<
Triggers
>
????????????????
<
asp:AsyncPostBackTrigger????ControlID
=
"
Button1
"
?
/>
????????????????
<
asp:PostBackTrigger??ControlID
=
"
Button2
"
?
/>
????????????
</
Triggers
>
??????????????
????????
</
asp:UpdatePanel
>
??????????
<
div?id
=
"
div1
"
?
>
??????????????
&
nbsp;
</
div
>
????????
????????
????
</
form
>
</
body
>
</
html
>
表示UpdatePanel終于呈現(xiàn)的HTML元素。Block（默認(rèn)）表示<div>，Inline表示<span>
指定Button2實(shí)現(xiàn)整頁更新。
.CS代碼為：
?
protected
?
void
?Button1_Click1(
object
?sender,?EventArgs?e)
????
{
??
????????SqlConnection?conn?
=
?
new
?SqlConnection(
"
server=.;uid=sa;pwd=;database=pubs
"
);
????????
string
?sql1?
=
?
"
select?top?5?au_lname?from?authors?
"
;
????????SqlDataAdapter?myAdapter?
=
?
new
?SqlDataAdapter(sql1,?conn);
????????DataSet?ds?
=
?
new
?DataSet();
????????myAdapter.Fill(ds,?
"
bieminG
"
);
????????
//
來自web?service的dataset,這里隨便一個ds就能夠;
????????
this
.GridView1.DataSource?
=
?ds.Tables[
"
bieminG
"
].DefaultView;?;
????????
this
.GridView1.DataBind();?
//
數(shù)據(jù)綁定
????}
????
protected
?
void
?Button2_Click(
object
?sender,?EventArgs?e)
????
{
????????
this
.Label1.Text?
=
?
"
11111
"
;
????}
Button1實(shí)現(xiàn)一個數(shù)據(jù)集的異步更新，BUTTON2就是一般的賦值了。看看是不是非常easy呀！呵呵！ ?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯(lián)系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點(diǎn)擊下面給點(diǎn)支持吧，站長非常感激您！手機(jī)微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點(diǎn)擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
