Compilazione di un elenco tramite CascadingDropDown (C#)

di Christian Wenz

Scarica il PDF

Il controllo CascadingDropDown in AJAX Control Toolkit estende un controllo DropDownList in modo che le modifiche apportate a un elenco a discesa carichino i valori associati in un altro elenco a discesa. Un elenco, ad esempio, fornisce un elenco di Stati Uniti e l'elenco successivo viene quindi riempito con le principali città in tale stato. La prima sfida da risolvere consiste nel compilare effettivamente un elenco a discesa usando questo controllo.

Panoramica

Il controllo CascadingDropDown in AJAX Control Toolkit estende un controllo DropDownList in modo che le modifiche apportate a un elenco a discesa carichino i valori associati in un altro elenco a discesa. Un elenco, ad esempio, fornisce un elenco di Stati Uniti e l'elenco successivo viene quindi riempito con le principali città in tale stato. La prima sfida da risolvere consiste nel compilare effettivamente un elenco a discesa usando questo controllo.

Passaggi

Per attivare la funzionalità di ASP.NET AJAX e Control Toolkit, il ScriptManager controllo deve essere inserito ovunque nella pagina (ma all'interno dell'elemento <form> ):

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

È quindi necessario un controllo DropDownList:

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

Per questo elenco, viene aggiunto un estensione CascadingDropDown. Invierà una richiesta asincrona a un servizio Web che restituirà quindi un elenco di voci da visualizzare nell'elenco. Per il funzionamento, è necessario impostare gli attributi CascadingDropDown seguenti:

• ServicePath: URL di un servizio Web che recapita le voci dell'elenco
• ServiceMethod: metodo Web che recapita le voci di elenco
• TargetControlID: ID dell'elenco a discesa
• Category: informazioni sulla categoria inviate al metodo Web quando viene chiamato
• PromptText: testo visualizzato quando si caricano in modo asincrono i dati dell'elenco dal server

Ecco il markup per l'elemento CascadingDropDown . L'unica differenza tra C# e VB è il nome del servizio Web associato:

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

Il codice JavaScript proveniente dall'estensione CascadingDropDown chiama un metodo di servizio Web con la firma seguente:

public CascadingDropDownNameValue[] MethodNameHere(string knownCategoryValues, 
    string category)

Pertanto, l'aspetto importante è che il metodo deve restituire una matrice di tipo CascadingDropDownNameValue (definita dalla ASP.NET AJAX Control Toolkit). Nel costruttore, prima il CascadingDropDownNameValue testo della voce dell'elenco e quindi il relativo valore deve essere fornito, esattamente come <option value="VALUE">NAME</option> avviene in HTML. Ecco alcuni dati di esempio:

<%@ WebService Language="C#" Class="CascadingDropdown0" %>
using System.Web.Script.Services;
using AjaxControlToolkit;
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Collections.Generic;
[ScriptService]
public class CascadingDropdown0 : System.Web.Services.WebService
{
 [WebMethod]
 public CascadingDropDownNameValue[] GetVendors(string knownCategoryValues, 
 string category)
 {
 List<CascadingDropDownNameValue> l = new List<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();
 }
}

Il caricamento della pagina nel browser attiva l'elenco da compilare con tre fornitori.

L'elenco viene riempito automaticamente (fare clic per visualizzare l'immagine full-size)