Использование CascadingDropDown с базой данных (VB)

Кристиан Венц (Christian Wenz)

Загрузить PDF-файл

Элемент управления CascadingDropDown в наборе элементов управления AJAX расширяет элемент управления DropDownList, чтобы изменения в одном DropDownList загружали связанные значения в другой DropDownList. Для этого необходимо создать специальную веб-службу.

Общие сведения

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

Этапы

Прежде всего, требуется источник данных. В этом примере используется база данных AdventureWorks и SQL Server 2005, экспресс-выпуск Майкрософт. База данных является необязательной частью установки Visual Studio (включая экспресс-выпуск) и также доступна для отдельной загрузки в разделе https://go.microsoft.com/fwlink/?LinkId=64064. База данных AdventureWorks является частью SQL Server примеров и примеров баз данных 2005 года (скачать по адресу https://www.microsoft.com/download/details.aspx?id=10679). Самый простой способ настроить базу данных — использовать SQL Server Management Studio Майкрософт (/sql/ssms/download-sql-server-management-studio-ssms) и присоединить AdventureWorks.mdf файл базы данных.

В этом примере предполагается, что экземпляр SQL Server 2005, экспресс-выпуск вызывается SQLEXPRESS и находится на том же компьютере, что и веб-сервер. Это также настройка по умолчанию. Если конфигурация отличается, необходимо адаптировать сведения о подключении к базе данных.

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

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

На следующем шаге требуются два элемента управления DropDownList. В этом примере мы используем сведения о поставщике и контактные данные из AdventureWorks, поэтому создадим один список для доступных поставщиков и один для доступных контактов:

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

Затем на страницу необходимо добавить два расширителя CascadingDropDown. Один заполняет первый список (поставщиков), а другой — второй (список контактов). Необходимо задать следующие атрибуты:

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

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

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

Расширители элементов управления для второго списка должны задать ParentControlID атрибут , чтобы при выборе записи в списке поставщиков активировался загрузка связанных элементов в списке контактов.

<ajaxToolkit:CascadingDropDown ID="ccd2" runat="server"
 ServicePath="CascadingDropdown1.vb.asmx" ServiceMethod="GetContactsForVendor"
 TargetControlID="ContactsList" ParentControlID="VendorsList"
 Category="Contact"
 PromptText="Select Contact" />

Затем фактические действия выполняются в веб-службе, которая настраивается следующим образом. Обратите внимание, что [ScriptService] атрибут используется, в противном случае ASP.NET AJAX не сможет создать прокси-сервер JavaScript для доступа к веб-методам из кода клиентского скрипта.

<%@ WebService Language="VB" Class="CascadingDropdown1" %>
Imports System.Web.Script.Services
Imports AjaxControlToolkit
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.Collections.Generic
Imports System.Collections.Specialized
Imports System.Data.SqlClient
<ScriptService()> _
Public Class CascadingDropdown1
 Inherits System.Web.Services.WebService
 ' ...
End Class

Сигнатура веб-методов, вызываемых CascadingDropDown, выглядит следующим образом:

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

Таким образом, возвращаемое значение должно быть массивом типа CascadingDropDownNameValue , определенного набором средств управления. Этот GetVendors() метод довольно прост в реализации: код подключается к базе данных AdventureWorks и запрашивает первые 25 поставщиков. Первый параметр в конструкторе CascadingDropDownNameValue — это подпись записи списка, второй — его значение (атрибут value в элементе <option> HTML). Ниже приведен код:

<WebMethod()> _
Public Function GetVendors(ByVal knownCategoryValues As String, ByVal category As String) As CascadingDropDownNameValue()
 Dim conn As New SqlConnection("server=(local)\SQLEXPRESS; Integrated Security=true; Initial Catalog=AdventureWorks")
 conn.Open()
 Dim comm As New SqlCommand( _
 "SELECT TOP 25 VendorID, Name FROM Purchasing.Vendor", conn)
 Dim dr As SqlDataReader = comm.ExecuteReader()
 Dim l As New List(Of CascadingDropDownNameValue)
 While (dr.Read())
 l.Add(New CascadingDropDownNameValue(dr("Name").ToString(),dr("VendorID").ToString()))
 End While
 conn.Close()
 Return l.ToArray()
End Function

Получить связанные контакты для поставщика (имя метода) GetContactsForVendor()немного сложнее. Прежде всего, необходимо определить поставщика, который был выбран в первом раскрывающемся списке. Набор средств управления определяет вспомогательный метод для этой задачи. Метод ParseKnownCategoryValuesString() возвращает StringDictionary элемент с данными раскрывающегося списка:

<WebMethod()> _
Public Function GetContactsForVendor(ByVal knownCategoryValues As String, ByVal category As String) As CascadingDropDownNameValue()
 Dim VendorID As Integer
 CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)

По соображениям безопасности эти данные необходимо сначала проверить. Таким образом, если имеется запись Vendor (так как Category свойство первого элемента CascadingDropDown имеет значение "Vendor"), можно получить идентификатор выбранного поставщика:

If Not kv.ContainsKey("Vendor") Or Not Int32.TryParse(kv("Vendor"),VendorID) Then
 Throw New ArgumentException("Couldn't find vendor.")
 End If

Остальная часть метода довольно прямолинейна, то. Идентификатор поставщика используется в качестве параметра для SQL-запроса, который получает все связанные контакты для этого поставщика. Еще раз метод возвращает массив типа CascadingDropDownNameValue.

Dim conn As New SqlConnection("server=(local)\SQLEXPRESS; Integrated Security=true; Initial Catalog=AdventureWorks")
 conn.Open()
 Dim comm As New SqlCommand("SELECT Person.Contact.ContactID, FirstName, LastName FROM Person.Contact,Purchasing.VendorContact WHERE VendorID=@VendorID AND Person.Contact.ContactID=Purchasing.VendorContact.ContactID",conn)
 comm.Parameters.AddWithValue("@VendorID", VendorID)
 Dim dr As SqlDataReader = comm.ExecuteReader()
 Dim l As New List(Of CascadingDropDownNameValue)
 While (dr.Read())
 l.Add(New CascadingDropDownNameValue(dr("FirstName").ToString() & " " & dr("LastName").ToString(),dr("ContactID").ToString()))
 End While
 conn.Close()
 Return l.ToArray()
End Function

Загрузите страницу ASP.NET и через некоторое время список поставщиков будет заполнен 25 записями. Выберите одну запись и обратите внимание на то, как второй раскрывающийся список заполняется данными.

Первый список заполняется автоматически (щелкните для просмотра полноразмерного изображения)

Второй список заполняется в соответствии с выбранным в первом списке (щелкните для просмотра полноразмерного изображения)

НазадВперед