作者 :克里斯蒂安·溫茲
ASP.NET AJAX 控制工具包中的 DynamicPopulate 控制項呼叫一個網頁服務(或頁面方法),並將所得值填入頁面上的目標控制項,無需頁面重新整理。
概觀
DynamicPopulate ASP.NET AJAX 控制工具包中的控制項呼叫網路服務(或頁面方法),並將所得值填入頁面上的目標控制項,無需頁面刷新。 這個教學示範了如何設定這個功能。
Steps
首先,你需要一個 ASP.NET 網路服務,它實作了 DynamicPopulate 將呼叫的方法。 網路服務類別需要定義在 Microsoft.Web.Script.Services 的 ScriptService 屬性,否則 ASP.NET AJAX 無法為網路服務建立客戶端 JavaScript 代理,而 DynamicPopulate 則需要該代理。
網頁方法必須預期有一個型別字串的參數,稱為 contextKey,因為 DynamicPopulate 控制項在每次網路服務呼叫時都會傳送一段上下文資訊。 以下網路服務以參數表示的格式 contextKey 回傳當前日期:
<%@ WebService Language="VB" Class="DynamicPopulate" %>
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Web.Script.Services
<ScriptService()> _
Public Class DynamicPopulate
Inherits System.Web.Services.WebService
<WebMethod()> _
Public Function getDate(ByVal contextKey As String) As String
Dim myDate As String = ""
Select Case contextKey
Case "format1"
myDate = String.Format("{0:MM}-{0:dd}-{0:yyyy}", DateTime.Now)
Case "format2"
myDate = String.Format("{0:dd}.{0:MM}.{0:yyyy}", DateTime.Now)
Case "format3"
myDate = String.Format("{0:yyyy}/{0:MM}/{0:dd}", DateTime.Now)
End Select
Return myDate
End Function
End Class
網路服務隨後儲存為 DynamicPopulate.vb.asmx。 或者,你也可以在包含 DynamicPopulate 控制項的實體 ASP.NET 頁面中,將 getDate() 方法作為頁面方法來實作。
下一步,建立一個新的 ASP.NET 檔案。 一如往常,第一步是在當前頁面中包含 , ScriptManager 以載入 ASP.NET AJAX 函式庫並讓控制工具包正常運作:
<asp:ScriptManager ID="asm" runat="server" />
接著,新增一個標籤控制項(例如使用同名的 HTML 控制項,或 <asp:Label /> web 控制項),之後會顯示網路服務呼叫的結果。
<label id="myDate" runat="server" />
接著會用一個 HTML 按鈕(作為 HTML 控制項,因為我們不需要回傳到伺服器)來觸發動態人口:
<input type="button" id="Button1" runat="server" value="Load date (m-d-y)" />
最後,我們需要 DynamicPopulateExtender 控制器來進行連線。 以下屬性將被設定(除了明顯的屬性外), ID 以及 runat="server":
-
TargetControlID將網路服務呼叫結果放在哪裡 -
ServicePath網路服務的路徑 (若想使用頁面方法則省略) -
ServiceMethod網頁方法名稱或頁面方法名稱 -
ContextKey要傳送到網路服務的上下文資訊 -
PopulateTriggerControlID觸發 Web 服務呼叫的元素 -
ClearContentsDuringUpdate是否在網路服務呼叫時清空目標元素
如你所見,控制需要一些資訊,但要把所有東西放到位其實很簡單。 以下是目前情境下控制點 DynamicPopulateExtender 的標記:
<ajaxToolkit:DynamicPopulateExtender ID="dpe1" runat="server"
ClearContentsDuringUpdate="true"
TargetControlID="myDate" ServicePath="DynamicPopulate.vb.asmx"
ServiceMethod="getDate"
ContextKey="format1" PopulateTriggerControlID="Button1" />
在瀏覽器中執行 ASP.NET 頁面並點擊按鈕;您將收到以月日年格式呈現的當前日期。
點擊按鈕即可從伺服器取得日期(點擊查看全尺寸圖片)