UpdatePanel控件也是Ajax里用得最多的控件之中的一個(gè)，UpdatePanel控件是用來(lái)局部更新網(wǎng)頁(yè)上的內(nèi)容，網(wǎng)頁(yè)上要局部更新的內(nèi)容必須放在UpdatePanel控件里，他必須和上一次說(shuō)的
ScriptManager控件一起使用。如今來(lái)看
UpdatePanel的屬性
指定Button2實(shí)現(xiàn)整頁(yè)更新。
.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
"
);
????????
//
來(lái)自web?service的dataset,這里隨便一個(gè)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)一個(gè)數(shù)據(jù)集的異步更新，BUTTON2就是一般的賦值了。看看是不是非常easy呀！呵呵！ ?
UpdatePanel
重要的屬性例如以下：
|
屬性
|
說(shuō)明
|
|
ChildrenAsTriggers
|
當(dāng)UpdateMode屬性為Conditional時(shí)，UpdatePanel中的子控件的異步回送是否會(huì)引發(fā)UpdatePanle的更新。
|
|
RenderMode
|
表示UpdatePanel終于呈現(xiàn)的HTML元素。Block（默認(rèn)）表示<div>，Inline表示<span>
|
|
UpdateMode
|
表示UpdatePanel的更新模式，有兩個(gè)選項(xiàng)：Always和Conditional。Always是無(wú)論有沒(méi)有Trigger，其它控件都將更新該UpdatePanel，Conditional表示僅僅有當(dāng)前UpdatePanel的Trigger，或ChildrenAsTriggers屬性為true時(shí)當(dāng)前UpdatePanel中控件引發(fā)的異步回送或者整頁(yè)回送，或是server端調(diào)用Update()方法才會(huì)引發(fā)更新該UpdatePanel。
|
ChildrenAsTriggers：
當(dāng)UpdateMode屬性為Conditional時(shí)，UpdatePanel中的子控件的異步回送是否會(huì)引發(fā)UpdatePanle的更新。
里面包括了一個(gè)Triggers,里面第一個(gè)屬性
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
=
"
整頁(yè)回送
"
?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)前時(shí)間
"
?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的更新模式，有兩個(gè)選項(xiàng)：Always和Conditional。Always是無(wú)論有沒(méi)有Trigger，其它控件都將更新該UpdatePanel，Conditional表示僅僅有當(dāng)前UpdatePanel的Trigger，或ChildrenAsTriggers屬性為true時(shí)當(dāng)前UpdatePanel中控件引發(fā)的異步回送或者整頁(yè)回送，或是server端調(diào)用Update()方法才會(huì)引發(fā)更新該UpdatePanel。
Contente Template：用來(lái)定義UpdatePanel的內(nèi)容
Triggers：分別為AsyncPostBackTrigger和PostBackTrigger
AsyncPostBackTrigge用來(lái)指定某個(gè)server端控件以及其將觸發(fā)的server端事件作為該UpdatePanel的異步更新觸發(fā)器，它須要設(shè)置的屬性有控件ID和服務(wù)端控件的事件；PostBackTrigger用來(lái)指定在UpdatePanel中的某個(gè)服務(wù)端控件，它所引發(fā)的回送不使用異步回送，而仍然是傳統(tǒng)的整頁(yè)回送
如今我們來(lái)做一個(gè)簡(jiǎn)單的實(shí)例：
Contente Template：用來(lái)定義UpdatePanel的內(nèi)容
Triggers：分別為AsyncPostBackTrigger和PostBackTrigger
AsyncPostBackTrigge用來(lái)指定某個(gè)server端控件以及其將觸發(fā)的server端事件作為該UpdatePanel的異步更新觸發(fā)器，它須要設(shè)置的屬性有控件ID和服務(wù)端控件的事件；PostBackTrigger用來(lái)指定在UpdatePanel中的某個(gè)服務(wù)端控件，它所引發(fā)的回送不使用異步回送，而仍然是傳統(tǒng)的整頁(yè)回送
如今我們來(lái)做一個(gè)簡(jiǎn)單的實(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
=
"
整頁(yè)回送
"
?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)前時(shí)間
"
?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)整頁(yè)更新。
.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
"
);
????????
//
來(lái)自web?service的dataset,這里隨便一個(gè)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)一個(gè)數(shù)據(jù)集的異步更新，BUTTON2就是一般的賦值了。看看是不是非常easy呀！呵呵！ ?
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號(hào)聯(lián)系： 360901061
您的支持是博主寫(xiě)作最大的動(dòng)力，如果您喜歡我的文章，感覺(jué)我的文章對(duì)您有幫助，請(qǐng)用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點(diǎn)擊下面給點(diǎn)支持吧，站長(zhǎng)非常感激您！手機(jī)微信長(zhǎng)按不能支付解決辦法：請(qǐng)將微信支付二維碼保存到相冊(cè)，切換到微信，然后點(diǎn)擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對(duì)您有幫助就好】元
