ASP.NET Ajax控件

AJAX代表異步的JavaScript和XML。這是一個跨平臺的技術,可以加快響應速度。 AJAX服務器控件將腳本添加到由瀏覽器執行和處理的頁面。

但是,像其他ASP.NET服務器控件一樣,這些AJAX服務器控件也可以擁有與它們關聯的方法和事件處理程序,這些處理程序在服務器端處理。

Visual Studio IDE中的控件工具箱包含一組稱爲「AJAX擴展」 的控件,

ScriptManager控件

ScriptManager控件是最重要的控件,並且必須存在於其他控件才能在頁面上工作。

它的基本語法,如下:

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

如果從「添加項目」 對話框創建「啓用Ajax的站點」 或添加「AJAX Web窗體」 ,則Web窗體將自動包含腳本管理器控件。 ScriptManager控件負責所有服務器端控件的客戶端腳本。

UpdatePanel控件

UpdatePanel控件是一個容器控件,並從Control類派生。 它充當其中的子控件的容器,沒有自己的接口。 當它內部的一個控件觸發了一個提交(post)後,UpdatePanel會介入以異步啓動提交併更新頁面的那一部分。

例如,如果按鈕控件位於更新面板內部並且被點擊,則只有更新面板中的控件將受到影響,頁面其他部分的控件將不受影響。這被稱爲部分回傳或異步回傳。

示例

在應用程序中添加一個AJAX Web表單。 它包含默認的腳本管理器(ScriptManager)控件,插入更新面板。 在更新面板控件內放置一個按鈕控件和一個標籤控件。 在面板外面放置另一組按鈕和標籤。

首先打開Visual Studio,創建一個名稱爲:AjaxControl 的空ASP.NET網站項目,如下所示 -

ASP.NET

在這個項目名稱上點擊右鍵,在彈出的選項中選擇:添加 -> 添加新項,選擇Web窗體,創建一個文件:Default.aspx, 如下所示 -

ASP.NET

設計視圖如下所示:

ASP.NET

請注意,執行該頁面時,如果點擊全部回傳按鈕,則會更新兩個標籤中的時間,但如果單擊局部回傳按鈕,則只會更新更新面板中的標籤。

運行上面項目,得到以下結果 -

ASP.NET

點擊控件後,可以看到以下效果 -

ASP.NET

一個頁面可以包含多個更新面板,每個面板包含其他控件(如網格)並顯示不同部分的數據。

全部回傳 發生時,更新面板內容默認內容。可以通過更改控件的UpdateMode屬性來更改此默認模式。看看更新面板的其他屬性。

UpdatePanel控件的屬性

下表顯示了UpdatePanel控件的屬性:

編號

屬性

描述

1

ChildrenAsTriggers

此屬性指示回發是否來自子控件,這會導致更新面板刷新。

2

ContentTemplate

它是內容模板,並定義在更新面板中顯示的內容。

3

ContentTemplateContainer

檢索動態創建的模板容器對象,並用於以編程方式添加子控件。

4

IsInPartialRendering

指示面板是否作爲部分回貼的一部分進行更新。

5

RenderMode

顯示渲染模式。可用的模式是BlockInline

6

UpdateMode

通過確定一些條件來獲取或設置渲染模式。

7

Triggers

定義每個對應於導致面板自動刷新的事件的收集觸發器對象。

UpdatePanel控件的方法

下表顯示了UpdatePanel控件的方法:

編號

方法

描述

1

CreateContentTemplateContainer

創建一個Control對象,作爲定義UpdatePanel控件內容的子控件的容器。

2

CreateControlCollection

返回UpdatePanel控件中包含的所有控件的集合。

3

Initialize

如果啓用了部分頁面呈現,則初始化UpdatePanel控件觸發器集合。

4

Update

導致更新UpdatePanel控件的內容。

UpdatePanel控件的行爲取決於UpdateMode屬性和ChildrenAsTriggers屬性的值。

UpdateMode

ChildrenAsTriggers

影響

Always

False

非法參數

Always

True

如果整個頁面刷新或其上的子控件回發,UpdatePanel會刷新。

Conditional

False

如果整個頁面刷新或者觸發外部控件啓動刷新,UpdatePanel將刷新。

Conditional

True

UpdatePanel刷新整個頁面刷新,或者其上的子控件回發或觸發控件在外部啓動刷新。

UpdateProgress控件

當一個或多個更新面板控件正在更新時,UpdateProgress控件在瀏覽器上提供了一種反饋。 例如,在執行某些面向數據庫的作業時,用戶登錄或等待服務器響應。

它提供了一個可視的確認,如「正在載入頁面…」,表示正在進行工作。

UpdateProgress控件的語法是:

<asp:UpdateProgress ID="UpdateProgress1" runat="server" DynamicLayout="true" AssociatedUpdatePanelID="UpdatePanel1" >

   <ProgressTemplate>
      Loading...
   </ProgressTemplate>

</asp:UpdateProgress>

上面的代碼片段顯示了ProgressTemplate標籤中的簡單消息。但是,這可能是一個圖像或其他相關的控制。 UpdateProgress控件將顯示每個異步回發,除非使用AssociatedUpdatePanelID屬性將其分配給單個更新面板。

UpdateProgress控件的屬性

下表顯示了UpdateProgress控件的屬性:

編號

屬性

描述

1

AssociatedUpdatePanelID

獲取並設置與此控件關聯的更新面板的ID。

2

Attributes

獲取或設置UpdateProgress控件的級聯樣式表(CSS)屬性。

3

DisplayAfter

獲取並設置顯示進度模板的時間(以毫秒爲單位)。 默認值是500

4

DynamicLayout

指示是否動態呈現進度模板。

5

ProgressTemplate

指示在異步回發期間顯示的模板,其比DisplayAfter時間花費更多的時間。

UpdateProgress控件的方法

下表顯示了UpdateProgress控件的方法:

編號

方法

描述

1

GetScriptDescriptors

返回UpdateProgress控件的客戶端功能所需的組件,行爲和客戶端控件的列表。

2

GetScriptReferences

返回UpdateProgress控件的客戶端腳本庫依賴項列表。

Timer控制

定時器(Timer)控件用於自動啓動回發。 這可以通過兩種方式來完成:

(1)設置UpdatePanel控件的Triggers屬性:

<Triggers> 
   <asp:AsyncPostBackTrigger ControlID="btnpanel2" EventName="Click" />
</Triggers>

(2)直接在UpdatePanel中放置一個Timer控件,作爲一個子控件觸發器。 一個計時器可以成爲多個UpdatePanel的觸發器。

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">

   <ContentTemplate>
      <asp:Timer ID="Timer1" runat="server" Interval="1000">
         </asp:Timer>

      <asp:Label ID="Label1" runat="server" Height="101px" style="width:304px" >
         </asp:Label>
   </ContentTemplate>

</asp:UpdatePanel>

易百教程移動端:請掃描本頁面底部(右側)二維碼並關注微信公衆號,回覆:"教程" 選擇相關教程閱讀或直接訪問:http://m.yiibai.com

上一篇:ASP.NET面板控件 下一篇:哥,這回真沒有了

加QQ羣啦,易百教程官方技術學習羣

QQ羣名稱

羣號

人數

免費

等級

羣介紹

JAVA技術

227270512

2000

LV5

Java基礎,JSP(Servlet),JAVA框架,Java高併發架構,Maven等等

MySQL/SQL

418407075

2000

LV5

SQL基礎,MySQL基礎,MySQL存儲過程,視圖,觸發器等等

大數據開發

655154550

2000

LV5

Spark,zookeeper,kafka,CDH,hive,fulme,hbase等Hadoop雲計算生態圈技術

Python技術

287904175

2000

LV5

Python編程,Python Web,Python大數據,Python爬蟲,自然語言處理等

Linux技術

479429477

2000

LV1

Redhat/Centos,Ubuntu,Shell,運維,監控等技術

PHP/Web開發者

460153241

1000

LV0

PHP基礎,PHP高級,網站優化/架構,JS,HTML,JQuery,前端等Web開發技術

人工智能

456236082

1000

LV0

人工智能,深度學習,算法等技術

Oracle數據庫

175248146

1000

LV0

SQL基礎,Oracle基礎,Oracle存儲過程,視圖,觸發器等等

Android開發

159629185

1000

LV0

Android開發,Android Studio,Kotlin,Dagger等技術

微軟技術

579821706

1000

LV0

C#,ASP.Net,VB.Net,ADO.Net,SQL Server,VBA,Excel等技術