Заполнение списка с помощью CascadingDropDown (C#)

Кристиан Венц

Скачать в формате PDF

Элемент управления CascadingDropDown в AJAX Control Toolkit расширяет элемент управления DropDownList, так что изменения в одном DropDownList загружают соответствующие значения в другом DropDownList. (Например, один список содержит список штатов США, а следующий список затем заполняется крупными городами в этом штате.) Первое решение заключается в том, чтобы фактически заполнить раскрывающийся список с помощью этого элемента управления.

Обзор

Элемент управления CascadingDropDown в AJAX Control Toolkit расширяет элемент управления DropDownList, так что изменения в одном DropDownList загружают соответствующие значения в другом DropDownList. (Например, один список содержит список штатов США, а следующий список затем заполняется крупными городами в этом штате.) Первое решение заключается в том, чтобы фактически заполнить раскрывающийся список с помощью этого элемента управления.

Шаги

Чтобы активировать функциональные возможности ASP.NET AJAX и набора средств управления, ScriptManager элемент управления должен быть помещен в любое место на странице (но в элементе <form> ):

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

Затем требуется элемент управления DropDownList:

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

Для этого списка добавляется расширитель CascadingDropDown. Он отправляет асинхронный запрос в веб-службу, которая затем возвращает список записей, которые будут отображаться в списке. Для этого необходимо задать следующие атрибуты CascadingDropDown:

  • ServicePath: URL-адрес веб-службы, предоставляющий записи списка
  • ServiceMethod: веб-метод доставки записей списка
  • TargetControlID: идентификатор раскрывающегося списка
  • Category: сведения о категории, отправляемые в веб-метод при вызове
  • PromptText: текст, отображаемый при асинхронной загрузке данных списка с сервера

Ниже приведена разметка для CascadingDropDown элемента. Единственное различие между C# и VB — это имя связанной веб-службы:

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

Код JavaScript, поступающий из CascadingDropDown расширения, вызывает метод веб-службы со следующей подписью:

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

Таким образом, важным аспектом является то, что метод должен возвращать массив типов CascadingDropDownNameValue (определяется набором элементов управления AJAX ASP.NET). В конструкторе CascadingDropDownNameValue сначала необходимо указать текст элемента списка, а затем его значение, так же, как это делается в <option value="VALUE">NAME</option> в HTML. Ниже приведены примеры данных:

<%@ 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();
 }
}

Загрузка страницы в браузере активирует список для заполнения тремя поставщиками.

Список заполняется автоматически

Список заполняется автоматически (щелкните, чтобы просмотреть изображение полного размера)