Atlas学习手记(12):使用CascadingDropDown控件


 本文示例源代码或素材下载

  主要内容

  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 />
     &nbsp;&nbsp;Order:
    <asp:DropDownList ID="ddlOrders" runat="server" /><br /><br />
     &nbsp;&nbsp;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如下:

  完整代码

using 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>
  <add name="ConnectionString" connectionString="Data Source=RJ-097;User ID=sa;Password=sa;Initial Catalog=Northwind" providerName="System.Data.SqlClient"/>
</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>

  至此,大功告成。运行后效果如下:

  选择:

本文作者:



相关阅读:
MySQL 5.0触发器参考教程
jquery 查找iframe父级页面元素的实现代码
js Clip的奇思妙想之文字拼接效果
下周二:微软高危级补丁倾巢出动
opensuse 11软件源
DEDECMS热门关键字代码
JQuery 操作select标签实现代码
XHTML基础教程:xhtml的块级标记
CSS技巧之圆角背景与三角形
JavaScript 对象链式操作测试代码
JavaScript 拾漏补遗
浅谈Oracle优化排序的操作
FreeBSD--4.9-RELEASE
mssql SA帐号的改名和删除
快速导航

Copyright © 2016 phpStudy |