altas(ajax)控件(六)：CascadingDropDown 联动选择的下拉框

CascadingDropDown 我个人感觉有几个规则：

1. 需要配合xml

2. 需要配合两个方法：CascadingDropDown.ParseKnownCategoryValuesString和CascadingDropDown.QuerySimpleCascadingDropDownDocument

3. 似乎需要配合WebService

希望有人指出错误之处。

联动选择的下拉框最多的应用我想应该是地区的选择吧，估计每个web程序员都碰到过，下面来看atlas的解决方案：

前端代码Default.aspx ：

< form id ="form1" runat ="server" >
< asp:ScriptManager ID ="ScriptManager1" runat ="server" />
< div class ="demoarea" >
< div class ="demoheading" > CascadingDropDown联动选择的下拉框 </ div >
< table >
< tr >
< td > 国家 </ td >
< td >< asp:DropDownList ID ="DropDownList1" runat ="server" Width ="170" /></ td >
</ tr >
< tr >
< td > 省份 </ td >
< td >< asp:DropDownList ID ="DropDownList2" runat ="server" Width ="170" /></ td >
</ tr >
< tr >
< td > 城市 </ td >
< td >< asp:DropDownList ID ="DropDownList3" runat ="server" Width ="170" AutoPostBack ="true"
OnSelectedIndexChanged ="DropDownList3_SelectedIndexChanged" /></ td >
</ tr >
</ table >

< cc1:CascadingDropDown ID ="CascadingDropDown1" runat ="server" TargetControlID ="DropDownList1"
Category ="Make" PromptText ="Pleaseselectamake" LoadingText ="[Loadingmakes...]"
ServicePath ="CarsService.asmx" ServiceMethod ="GetDropDownContents" />
< cc1:CascadingDropDown ID ="CascadingDropDown2" runat ="server" TargetControlID ="DropDownList2"
Category ="Model" PromptText ="Pleaseselectamodel" LoadingText ="[Loadingmodels...]"
ServiceMethod ="GetDropDownContentsPageMethod" ParentControlID ="DropDownList1" />
< cc1:CascadingDropDown ID ="CascadingDropDown3" runat ="server" TargetControlID ="DropDownList3"
Category ="Color" PromptText ="Pleaseselectacolor" LoadingText ="[Loadingcolors...]"
ServicePath ="CarsService.asmx" ServiceMethod ="GetDropDownContents"
ParentControlID ="DropDownList2" />

< asp:UpdatePanel ID ="UpdatePanel1" runat ="server" UpdateMode ="Conditional" RenderMode ="inline" >
< ContentTemplate >
< asp:Label ID ="Label1" runat ="server" Text ="[您还没有选择]" />
</ ContentTemplate >
< Triggers >
< asp:AsyncPostBackTrigger ControlID ="DropDownList3" EventName ="SelectedIndexChanged" />
</ Triggers >
</ asp:UpdatePanel >
</ div >
</ form >

Default.aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Web.Services;
using AjaxControlToolkit;

public partial class _Default:System.Web.UI.Page
... {
protectedvoidPage_Load(objectsender,EventArgse)
...{

}
protectedvoidTextBox1_TextChanged(objectsender,EventArgse)
...{

}
protectedvoidButton1_Click(objectsender,EventArgse)
...{

}
protectedvoidDropDownList3_SelectedIndexChanged(objectsender,EventArgse)
...{
//Getselectedvalues
stringmake=DropDownList1.SelectedItem.Text;
stringmodel=DropDownList2.SelectedItem.Text;
stringcolor=DropDownList3.SelectedItem.Text;

//Outputresultstringbasedonwhichvaluesarespecified
if(string.IsNullOrEmpty(make))
...{
Label1.Text="Pleaseselectamake.";
}
elseif(string.IsNullOrEmpty(model))
...{
Label1.Text="Pleaseselectamodel.";
}
elseif(string.IsNullOrEmpty(color))
...{
Label1.Text="Pleaseselectacolor.";
}
else
...{
Label1.Text=string.Format("您选择的地区是{0}{1}{2}。",color,make,model);
}
}

[WebMethod]
[System.Web.Script.Services.ScriptMethod]
publicstaticCascadingDropDownNameValue[]GetDropDownContentsPageMethod(stringknownCategoryValues,stringcategory)
...{
returnnewCarsService().GetDropDownContents(knownCategoryValues,category);
}
}

数据：

<? xmlversion="1.0"encoding="utf-8" ?>
< CarsService >
< make name ="中国" >
< model name ="浙江" >
< color name ="杭州" />
< color name ="宁波" />
< color name ="金华" />
</ model >
< model name ="江苏" >
< color name ="南京" />
< color name ="苏州" />
</ model >
< model name ="福建" >
< color name ="福州" />
< color name ="厦门" />
</ model >
</ make >
< make name ="美国" >
< model name ="A4" >
< color name ="Azure" />
< color name ="LightAzure" />
< color name ="DarkAzure" />
</ model >
< model name ="S4" value ="S4(value)" >
< color name ="Silver" value ="Silver(value)" />
< color name ="Metallic" value ="Metallic(value)" />
</ model >
< model name ="A6" value ="A6(value)" >
< color name ="Cyan" value ="Cyan(value)" />
</ model >
</ make >
< make name ="韩国" >
< model name ="3series" value ="3series(value)" >
< color name ="Blue" value ="Blue(value)" />
< color name ="SkyBlue" value ="SkyBlue(value)" />
< color name ="RacingBlue" value ="RacingBlue(value)" />
</ model >
< model name ="5series" value ="5series(value)" >
< color name ="Yellow" value ="Yellow(value)" />
< color name ="Banana" value ="Banana(value)" />
</ model >
< model name ="7series" value ="7series(value)" >
< color name ="Brown" value ="Brown(value)" />
</ model >
</ make >
</ CarsService >

WebService 代码：

// (c)CopyrightMicrosoftCorporation.
// ThissourceissubjecttotheMicrosoftPermissiveLicense.
// See http://www.microsoft.com/resources/sharedsource/licensingbasics/sharedsourcelicenses.mspx.
// Allotherrightsreserved.


using System;
using System.Collections.Specialized;
using System.Web;
using System.Web.Services;
using System.Xml;

/**/ ///<summary>
///HelperwebserviceforCascadingDropDownsample
///</summary>
[WebService(Namespace = " http://tempuri.org/ " )]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class CarsService:WebService
... {
//Membervariables
privatestaticXmlDocument_document;
privatestaticobject_lock=newobject();

//wemakethesepublicstaticsjustsowecancallthemfromexternallyforthe
//pagemethodcall
publicstaticXmlDocumentDocument
...{
get
...{
lock(_lock)
...{
if(_document==null)
...{
//ReadXMLdatafromdisk
http:

分享到：

altas(ajax)控件(七)：CollapsiblePanel ... | 2007-08-24 日志：真正如里程碑般的日志

• 2007-08-25 10:20
• 浏览 220
• 评论(0)
• 相关推荐

评论

发表评论

您还没有登录,请您登录后再发表评论