Partager via

Remplissage d’une liste avec CascadingDropDown (VB)

  • Article

par Christian Wenz

Télécharger le PDF

Le contrôle CascadingDropDown dans ajax Control Toolkit étend un contrôle DropDownList afin que les modifications d’un DropDownList chargent les valeurs associées dans un autre DropDownList. (Pour instance, une liste fournit une liste des États américains, et la liste suivante est ensuite remplie avec les principales villes de cet état.) Le premier défi à résoudre est de remplir une liste déroulante à l’aide de ce contrôle.

Vue d’ensemble

Le contrôle CascadingDropDown dans ajax Control Toolkit étend un contrôle DropDownList afin que les modifications d’un DropDownList chargent les valeurs associées dans un autre DropDownList. (Pour instance, une liste fournit une liste des États américains, et la liste suivante est ensuite remplie avec les principales villes de cet état.) Le premier défi à résoudre est de remplir une liste déroulante à l’aide de ce contrôle.

Étapes

Pour activer les fonctionnalités de ASP.NET AJAX et du Kit de ressources de contrôle, le ScriptManager contrôle doit être placé n’importe où sur la page (mais dans l’élément <form> ) :

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

Ensuite, un contrôle DropDownList est requis :

<div>
 Vendor: <asp:DropDownList ID="VendorsList" runat="server" />
</div>

Pour cette liste, un extendeur CascadingDropDown est ajouté. Il envoie une requête asynchrone à un service web qui retourne ensuite une liste d’entrées à afficher dans la liste. Pour que cela fonctionne, les attributs CascadingDropDown suivants doivent être définis :

  • ServicePath: URL d’un service web qui fournit les entrées de liste
  • ServiceMethod: méthode web remettant les entrées de liste
  • TargetControlID: ID de la liste déroulante
  • Category: informations de catégorie envoyées à la méthode web lorsqu’elles sont appelées
  • PromptText: Texte affiché lors du chargement asynchrone des données de liste à partir du serveur

Voici le balisage de l’élément CascadingDropDown . La seule différence entre C# et VB est le nom du service web associé :

<ajaxToolkit:CascadingDropDown ID="ccd1" runat="server"
 ServicePath="CascadingDropdown0.vb.asmx" ServiceMethod="GetVendors"
 TargetControlID="VendorsList" Category="Vendor" />

Le code JavaScript provenant de l’extendeur CascadingDropDown appelle une méthode de service web avec la signature suivante :

Public Function MethodNameHere(ByVal knownCategoryValues As String, ByVal category As String) As CascadingDropDownNameValue()

L’aspect important est donc que la méthode doit retourner un tableau de type CascadingDropDownNameValue (défini par le ASP.NET ajax Control Toolkit). Dans le CascadingDropDownNameValue constructeur, tout d’abord le texte de l’entrée de liste, puis sa valeur doivent être fournis, comme <option value="VALUE">NAME</option> le ferait en HTML. Voici quelques exemples de données :

<%@ WebService Language="VB" Class="CascadingDropDown0" %>
Imports System.Web.Script.Services
Imports AjaxControlToolkit
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Collections.Generic
<ScriptService()> _
Public Class CascadingDropDown0
 Inherits System.Web.Services.WebService
 <WebMethod()> _
 Public Function GetVendors(ByVal knownCategoryValues As String, ByVal category As String) As CascadingDropDownNameValue()
 Dim l As New List(Of CascadingDropDownNameValue)
 l.Add(New CascadingDropDownNameValue("International", "1"))
 l.Add(New CascadingDropDownNameValue("Electronic Bike Repairs & Supplies","2"))
 l.Add(New CascadingDropDownNameValue("Premier Sport, Inc.", "3"))
 Return l.ToArray()
 End Function
End Class

Le chargement de la page dans le navigateur déclenche la liste à remplir avec trois fournisseurs.

La liste est remplie automatiquement

La liste est remplie automatiquement (cliquer pour afficher l’image en taille réelle)

PrécédentSuivant