Preconfigurar entradas de lista con CascadingDropDown (C#)

por Christian Wenz

Descargar PDF

El control CascadingDropDown del Kit de herramientas de control de AJAX extiende un control DropDownList para que los cambios en uno de estos controles carguen los valores asociados en otro de estos controles. Con un poco de código es posible que un elemento de lista se preseleccione una vez cargados los datos de manera dinámica.

Información general

El control CascadingDropDown del Kit de herramientas de control de AJAX extiende un control DropDownList para que los cambios en uno de estos controles carguen los valores asociados en otro de estos controles. (Por ejemplo, una lista proporciona una lista de estados de EE. UU., y la siguiente lista se rellena con las principales ciudades de ese estado). Con un poco de código es posible que un elemento de lista se preseleccione una vez cargados los datos de manera dinámica.

Pasos

Para activar la funcionalidad de ASP.NET AJAX y el Kit de herramientas de control, el control ScriptManager debe colocarse en cualquier parte de la página (pero dentro del elemento <form>):

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

A continuación, se requiere un control DropDownList:

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

Para esta lista, se agrega un extensor CascadingDropDown, que proporciona información de método y la dirección URL del servicio web:

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

El extensor CascadingDropDown llama entonces de forma asincrónica a un servicio web con la siguiente firma de método:

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

El método devuelve una matriz de tipo CascadingDropDown. El constructor del tipo espera primero el título de la entrada de lista y, a continuación, el valor (atributo HTML value). Si el tercer argumento se establece en true, el elemento de lista se selecciona automáticamente en el explorador.

<%@ WebService Language="C#" Class="CascadingDropdown2" %>
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 CascadingDropdown2 : 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", true));
 l.Add(new CascadingDropDownNameValue(
 "Premier Sport, Inc.", "3"));
 return l.ToArray();
 }
}

Al cargar la página en el explorador se rellenará la lista desplegable con tres proveedores, donde el segundo está ya seleccionado.

The list is filled and preselected automatically

La lista se rellena y se preselecciona automáticamente (haga clic para ver la imagen a tamaño completo).