데이터베이스에 CascadingDropDown 사용(VB)

작성자: Christian Wenz

PDF 다운로드

AJAX 컨트롤 도구 키트의 CascadingDropDown 컨트롤은 DropDownList 컨트롤을 확장하여 한 DropDownList의 변경 내용이 다른 DropDownList에 연결된 값을 로드합니다. 이렇게 하려면 특수 웹 서비스를 만들어야 합니다.

개요

AJAX 컨트롤 도구 키트의 CascadingDropDown 컨트롤은 DropDownList 컨트롤을 확장하여 한 DropDownList의 변경 내용이 다른 DropDownList에 연결된 값을 로드합니다. (instance 경우 한 목록은 미국 주 목록을 제공하고 다음 목록은 해당 주의 주요 도시로 채워집니다.) 이렇게 하려면 특수 웹 서비스를 만들어야 합니다.

단계

우선 데이터 원본이 필요합니다. 이 샘플에서는 AdventureWorks 데이터베이스 및 Microsoft SQL Server 2005 Express Edition 사용합니다. 데이터베이스는 Visual Studio 설치(Express Edition 포함)의 선택적 부분이며 에서 https://go.microsoft.com/fwlink/?LinkId=64064별도의 다운로드로도 사용할 수 있습니다. AdventureWorks 데이터베이스는 SQL Server 2005 샘플 및 샘플 데이터베이스의 일부입니다(에서 https://www.microsoft.com/download/details.aspx?id=10679다운로드). 데이터베이스를 설정하는 가장 쉬운 방법은 Microsoft SQL Server Management Studio(/sql/ssms/download-sql-server-management-studio-ssms)을 사용하고 데이터베이스 파일을 연결하는 AdventureWorks.mdf 것입니다.

이 샘플에서는 SQL Server 2005 Express Edition instance 호출 SQLEXPRESS 되고 웹 서버와 동일한 컴퓨터에 상주한다고 가정합니다. 이는 기본 설정이기도 합니다. 설정이 다른 경우 데이터베이스에 대한 연결 정보를 조정해야 합니다.

ASP.NET AJAX 및 제어 도구 키트의 기능을 활성화하려면 컨트롤을 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: 드롭다운 목록의 ID
  • 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()

따라서 반환 값은 Control Toolkit에 의해 정의된 형식 CascadingDropDownNameValue 의 배열이어야 합니다. 메서드는 GetVendors() 구현하기가 매우 쉽습니다. 코드는 AdventureWorks 데이터베이스에 연결하고 처음 25개 공급업체를 쿼리합니다. 생성자의 첫 번째 매개 변수는 목록 항목의 캡션, 두 번째 매개 변수 CascadingDropDownNameValue 는 해당 값(HTML 요소의 값 특성)입니다option<>. 코드는 다음과 같습니다.

<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())에 대한 연결된 연락처를 가져오는 것은 조금 더 까다롭습니다. 우선 첫 번째 드롭다운 목록에서 선택된 공급업체를 결정해야 합니다. Control Toolkit은 해당 작업에 대한 도우미 메서드를 정의합니다. 메서드는 ParseKnownCategoryValuesString() 드롭다운 데이터가 있는 StringDictionary 요소를 반환합니다.

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

보안상의 이유로 이 데이터의 유효성을 먼저 검사해야 합니다. 따라서 공급업체 항목이 있는 경우(첫 번째 CascadingDropDown 요소의 속성이 로 "Vendor"설정되었기 때문에Category) 선택한 공급업체의 ID를 검색할 수 있습니다.

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

메서드의 나머지 는 상당히 직선 앞으로, 다음. 공급업체의 ID는 해당 공급업체에 대한 모든 연결된 연락처를 검색하는 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개의 항목이 채워집니다. 하나의 항목을 선택하고 두 번째 드롭다운 목록이 데이터로 채워지는 방법을 확인합니다.

첫 번째 목록이 자동으로 채워집니다.

첫 번째 목록이 자동으로 채워집니다(전체 크기 이미지를 보려면 클릭).

두 번째 목록은 첫 번째 목록의 선택 항목에 따라 채워집니다.

두 번째 목록은 첫 번째 목록의 선택 항목에 따라 채워집니다(전체 크기 이미지를 보려면 클릭).