Dynamiczne wypełnianie danych do kontrolki (VB)

Autor: Christian Wenz

Pobierz plik PDF

Kontrolka DynamicPopulate w zestawie narzędzi sterowania AJAX ASP.NET wywołuje usługę internetową (lub metodę strony) i wypełnia wynikową wartość w kontrolce docelowej na stronie bez odświeżania strony.

Przegląd

Kontrolka DynamicPopulate w ASP.NET AJAX Control Toolkit wywołuje usługę internetową (lub metodę strony) i wypełnia wynikową wartość w kontrolce docelowej na stronie bez odświeżania strony. W tym samouczku pokazano, jak to skonfigurować.

Kroki

Przede wszystkim potrzebna jest usługa sieci Web ASP.NET, która implementuje metodę wywoływaną przez DynamicPopulate. Klasa usługi sieci Web wymaga atrybutu ScriptService, który jest zdefiniowany w Microsoft.Web.Script.Services; w przeciwnym razie ASP.NET AJAX nie może wygenerować serwera proxy JavaScript po stronie klienta dla usługi sieci Web, która z kolei jest wymagana przez DynamicPopulate.

Metoda sieci Web musi oczekiwać jednego argumentu typu string o nazwie contextKey, ponieważ kontrolka DynamicPopulate wysyła jeden element informacji kontekstowych w ramach każdego wywołania usługi sieciowej. Następująca usługa internetowa zwraca bieżącą datę w formacie reprezentowanym contextKey przez argument:

<%@ 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

Usługa internetowa jest następnie zapisywana jako DynamicPopulate.vb.asmx. Alternatywnie można zaimplementować getDate() metodę jako metodę strony na rzeczywistej stronie ASP.NET za pomocą kontrolki DynamicPopulate .

W następnym kroku utwórz nowy plik ASP.NET. Jak zawsze, pierwszym krokiem jest dołączenie ScriptManager na bieżącej stronie, aby załadować bibliotekę ASP.NET AJAX i aby zestaw narzędzi Control Toolkit działał poprawnie.

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

Następnie dodaj kontrolkę etykiety (na przykład przy użyciu kontrolki HTML o tej samej nazwie lub <asp:Label> / kontrolce internetowej), która później pokaże wynik wywołania usługi internetowej.

<label id="myDate" runat="server" />

Przycisk HTML (jako kontrolka HTML, ponieważ nie wymagamy powrotu do serwera) zostanie użyty do wyzwolenia populacji dynamicznej:

<input type="button" id="Button1" runat="server" value="Load date (m-d-y)" />

Na koniec potrzebujemy DynamicPopulateExtender sterownika, aby wszystko połączyć. Następujące atrybuty zostaną ustawione (oprócz oczywistych ID i runat="server"):

• TargetControlID gdzie umieścić wynik z wywołania usługi internetowej
• ServicePath ścieżka do usługi internetowej (pomiń, jeśli chcesz użyć metody na stronie)
• ServiceMethod nazwa metody internetowej lub metody strony
• ContextKey informacje kontekstowe, które mają być wysyłane do usługi internetowej
• PopulateTriggerControlID element, który wyzwala wywołanie usługi internetowej
• ClearContentsDuringUpdate czy opróżnić element docelowy podczas wywołania usługi internetowej

Jak widać, kontrolka wymaga pewnych informacji, ale umieszczenie wszystkiego w miejscu jest dość proste. Oto znaczniki dla kontrolki DynamicPopulateExtender w bieżącym scenariuszu:

<ajaxToolkit:DynamicPopulateExtender ID="dpe1" runat="server"
 ClearContentsDuringUpdate="true"
 TargetControlID="myDate" ServicePath="DynamicPopulate.vb.asmx"
 ServiceMethod="getDate"
 ContextKey="format1" PopulateTriggerControlID="Button1" />

Uruchom stronę ASP.NET w przeglądarce i kliknij przycisk; Otrzymasz bieżącą datę w formacie miesiąc-dzień-rok.

Kliknięcie przycisku pobiera datę z serwera (kliknij, aby wyświetlić obraz o pełnym rozmiarze)