Atlas学习手记（12）：使用CascadingDropDown控件

CascadingDropDown通常叫作级联下拉菜单，本文将通过读取Northwind数据库中的Emplyee、Order、OrderDatail信息作为示例，来展示一下它的使用。

主要内容

1．CascadingDropDown控件介绍

2．从数据库读取数据并填充CascadingDropDown

一．CascadingDropDown控件介绍

CascadingDropDown通常叫作级联下拉菜单，本文将通过读取Northwind数据库中的Emplyee、Order、OrderDatail信息作为示例，来展示一下它的使用。示例代码如下：

<atlasToolkit:CascadingDropDown ID="CDD1" runat="server">

<atlasToolkit:CascadingDropDownProperties

TargetControlID="DropDownList2"

Category="Model"

PromptText="Please select a model"

LoadingText="[Loading models

ServicePath="CarsService.asmx"

ServiceMethod="GetDropDownContents"

ParentControlID="DropDownList1"

SelectedValue="SomeValue">

</atlasToolkit:CascadingDropDownProperties>

</atlasToolkit:CascadingDropDown>

对于CascadingDropDown需要为它添加CascadingDropDownProperties，有多少个下拉列表，就添加几个CascadingDropDownProperties，主要属性如下：

属性	说明
TargetControlID	指定要扩展的DropDownList的ID
Category	DropDownList表示的类别名称，在WebMethod中会用到
PromptText	没有选择时显示的文字
LoadingText	加载数据时显示的文字
ServicePath	获取数据的Web Service，为每个DropDownList都要指定
ServiceMethod	获取数据的Web Method
ParentControlID	要扩展的DropDownList的父控件ID
SelectedValue	默认的选择项的值

二．从数据库读取数据并填充CascadingDropDown

下面用读取Northwind数据库中的Emplyee、Order、OrderDatail信息，看一个完整的示例。在新建一个Web Site后，先在页面的头部加上：

<%@ Register Assembly="AtlasControlToolkit"

Namespace="AtlasControlToolkit"

TagPrefix="atlasToolkit" %>

加入三个DropDownList，分别用来显示Emplyee，Order，OrderDatail：

<div>

<h3>

Employee:

<asp:DropDownList ID="ddlEmployees" runat="server" /><br /><br />

  Order:

<asp:DropDownList ID="ddlOrders" runat="server" /><br /><br />

  Detail:

<asp:DropDownList ID="ddlOrderDetails" runat="server" />

</h3>

</div>

下面我们添加一个Northwind.asmx的Web Service，编写相关的Web Method：

[WebMethod]

public CascadingDropDownNameValue[] GetEmployees(

string knownCategoryValues, string category)

{

string connectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

SqlConnection connection = new

SqlConnection(connectionString);

SqlCommand command = new SqlCommand("SELECT * FROM Employees");

command.Connection = connection;

connection.Open();

SqlDataAdapter adapter = new SqlDataAdapter(command);

DataSet dataSet = new DataSet();

adapter.Fill(dataSet);

command.Connection.Close();

DataTable tbl = dataSet.Tables[0];

List<CascadingDropDownNameValue> values =

new List<CascadingDropDownNameValue>();

foreach (DataRow dr in tbl.Rows)

{

string sEmployee = (string)dr["FirstName"] + " " +

dr["LastName"];

int iEmployee = (int)dr["EmployeeID"];

values.Add(new CascadingDropDownNameValue(

sEmployee, iEmployee.ToString()));

}

return values.ToArray();

}

注意Web Method的参数签名是不可以改变的，并且它最后返回的是名-值对这种形式的数组。

整个完整后的Web Service如下：

完整代码 System;

using System.Web;

using System.Collections;

using System.Configuration;

using System.Collections.Generic;

using System.Collections.Specialized;

using System.Web.Services;

using System.Web.Services.Protocols;

using AtlasControlToolkit;

using System.Data;

using System.Data.SqlClient;

/// <summary>

/// Summary description for Northwind

/// </summary>

[WebService(Namespace = "http://tempuri.org/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

public class Northwind : System.Web.Services.WebService {

public Northwind () {

//Uncomment the following line if using designed components

//InitializeComponent();

}

[WebMethod]

public CascadingDropDownNameValue[] GetEmployees(

string knownCategoryValues, string category)

{

string connectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

SqlConnection connection = new

SqlConnection(connectionString);

SqlCommand command = new SqlCommand("SELECT * FROM Employees");

command.Connection = connection;

connection.Open();

SqlDataAdapter adapter = new SqlDataAdapter(command);

DataSet dataSet = new DataSet();

adapter.Fill(dataSet);

command.Connection.Close();

DataTable tbl = dataSet.Tables[0];

List<CascadingDropDownNameValue> values =

new List<CascadingDropDownNameValue>();

foreach (DataRow dr in tbl.Rows)

{

string sEmployee = (string)dr["FirstName"] + " " +

dr["LastName"];

int iEmployee = (int)dr["EmployeeID"];

values.Add(new CascadingDropDownNameValue(

sEmployee, iEmployee.ToString()));

}

return values.ToArray();

}

[WebMethod]

public CascadingDropDownNameValue[] GetOrdersByEmployee(

string knownCategoryValues,

string category)

{

StringDictionary kv = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);

int iEmployee;

if (!kv.ContainsKey("Employee") || !Int32.TryParse(kv["Employee"], out iEmployee))

{

return null;

}

string connectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

SqlConnection connection = new

SqlConnection(connectionString);

SqlCommand command =

new SqlCommand("SELECT OrderID FROM Orders WHERE EmployeeID = " + iEmployee);

command.Connection = connection;

connection.Open();

SqlDataAdapter adapter = new SqlDataAdapter(command);

DataSet dataSet = new DataSet();

adapter.Fill(dataSet);

command.Connection.Close();

DataTable tbl = dataSet.Tables[0];

List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();

foreach (DataRow dr in tbl.Rows)

{

string sOrder = dr["OrderID"].ToString();

int iOrder = (int)dr["OrderID"];

values.Add(new CascadingDropDownNameValue(

sOrder, iOrder.ToString()));

}

return values.ToArray();

}

[WebMethod]

public CascadingDropDownNameValue[] GetDetailsByOrder(

string knownCategoryValues,

string category)

{

StringDictionary kv = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);

int iOrder;

if (!kv.ContainsKey("Order") || !Int32.TryParse(kv["Order"], out iOrder))

{

return null;

}

string connectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

SqlConnection connection = new

SqlConnection(connectionString);

SqlCommand command =

new SqlCommand("SELECT UnitPrice,OrderID FROM [Order Details] WHERE OrderID = " + iOrder);

command.Connection = connection;

connection.Open();

SqlDataAdapter adapter = new SqlDataAdapter(command);

DataSet dataSet = new DataSet();

adapter.Fill(dataSet);

command.Connection.Close();

DataTable tbl = dataSet.Tables[0];

List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();

foreach (DataRow dr in tbl.Rows)

{

string UnitPrice = dr["UnitPrice"].ToString();

int intOrder = (int)dr["OrderID"];

values.Add(new CascadingDropDownNameValue(

UnitPrice, intOrder.ToString()));

}

return values.ToArray();

}

在Web.config中设置连接信息：

</connectionStrings>

这时我们再添加CascadingDropDown控件，设置它的属性如下：

<atlasToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server">

<atlasToolkit:CascadingDropDownProperties Category="Employee" ParentControlID=""

PromptText="Select Employee" SelectedValue="" ServiceMethod="GetEmployees" ServicePath="Northwind.asmx"

TargetControlID="ddlEmployees" />

<atlasToolkit:CascadingDropDownProperties Category="Order" ParentControlID="ddlEmployees"

PromptText="Select Order" SelectedValue="" ServiceMethod="GetOrdersByEmployee"

ServicePath="Northwind.asmx" TargetControlID="ddlOrders" />

<atlasToolkit:CascadingDropDownProperties Category="OrderDetail" ParentControlID="ddlOrders"

PromptText="Select OrderDetail" SelectedValue="" ServiceMethod="GetDetailsByOrder"

ServicePath="Northwind.asmx" TargetControlID="ddlOrderDetails" />

</atlasToolkit:CascadingDropDown>

至此，大功告成。运行后效果如下：

选择：

完整示例下载