AJAX控件之CascadingDropDown

最新推荐文章于 2019-01-08 08:15:05 发布

kingwu008

最新推荐文章于 2019-01-08 08:15:05 发布

阅读量1.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： ASP.NET/AJAX/CSS 文章标签： ajax webservice server hierarchy asp object

本文链接：https://blog.youkuaiyun.com/kingwu008/article/details/4353624

ASP.NET/AJAX/CSS 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了如何使用Ajax控件实现CascadingDropDown功能，并分享了作者在学习过程中的经验和遇到的问题解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

哎，最近需要学习Ajax来架构网站，没有办法啊，只有到处找资料来学了哦。Ajax的功能确实很炫也很酷，但是控件哪么多，要学好还真的有点难度啊，只要是他的结构和很多控件的使用难。一开始看了视频，就开始自己动手了，可是在动手过程中出了N多问题啊。一边解决一边GO ON。哎，搞了很长时间，才把它终于搞定了。在此说说我的一些经验吧。

还是以我做的这个实例来说明：

我按照视频做的是一个对DropDownList的一种效果和功能的控制，实现效果图如下：

在进行代码编写过程中遇到了很多的问题，首先，这个CascadingDropDown控件就不是很稳定，所以在进行调试的时候可能有些代码就会丢失，还有一个就是Webservice.cs的编写，如果不写在.cs中，写在Webservice.asmx中，就不能实现效果，可能是有错吧。

下面我就给出这个控件的代码实例（希望对大家都点帮助）：

Default.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" EnableEventValidation="false" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>AJAX控件之CascadingDropDown</title>
</head>
<body style="text-align: center">
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div>
            <table border="1">
                <tr>
                    <td style="width: 100px; height: 26px;">
                        省</td>
                    <td style="width: 100px; height: 26px;">
                        <asp:DropDownList ID="DropDownList1" runat="server" Width="100px">
                        </asp:DropDownList></td>
                </tr>
                <tr>
                    <td style="width: 100px; height: 26px;">
                        市</td>
                    <td style="width: 100px; height: 26px;">
                        <asp:DropDownList ID="DropDownList2" runat="server" Width="100px">
                        </asp:DropDownList></td>
                </tr>
                <tr>
                    <td style="width: 100px">
                        县</td>
                    <td style="width: 100px">
                        <asp:DropDownList ID="DropDownList3" runat="server" Width="100px" OnSelectedIndexChanged="DropDownList3_SelectedIndexChanged" AutoPostBack="True">
                        </asp:DropDownList></td>
                </tr>
            </table>
        </div>
        <cc1:CascadingDropDown ID="CascadingDropDown1" runat="server" Category="province"
            LoadingText="正在加载..." PromptText="请选择省" ServiceMethod="GetDropDownContents" TargetControlID="DropDownList1" ServicePath="WebService.asmx">
        </cc1:CascadingDropDown>
        <cc1:CascadingDropDown ID="CascadingDropDown2" runat="server" Category="city" LoadingText="正在加载..."
            PromptText="请选择市" ServiceMethod="GetDropDownContents"
            ServicePath="WebService.asmx" TargetControlID="DropDownList2" ParentControlID="DropDownList1">
        </cc1:CascadingDropDown>
        <cc1:CascadingDropDown ID="CascadingDropDown3" runat="server" Category="county"
            LoadingText="正在加载..." PromptText="请选择县" ServiceMethod="GetDropDownContents"
            TargetControlID="DropDownList3" ServicePath="WebService.asmx" ParentControlID="DropDownList2">
        </cc1:CascadingDropDown>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" RenderMode="Inline" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:Label ID="Label1" runat="server" Text="还未选择"></asp:Label>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
            </Triggers>
        </asp:UpdatePanel>
    </form>
</body>
</html>

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;

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

    }
    protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (this.DropDownList3.SelectedItem.Text == "")
        {
            this.Label1.Text = "您还有一项未选择哦！";
        }
        else
        {
            Label1.Text = "您的籍贯是" + DropDownList1.SelectedItem.Text + DropDownList2.SelectedItem.Text + DropDownList3.SelectedItem.Text;
        }
    }
}

XML.xml:

<?xml version="1.0" encoding="utf-8"?>
<WebService>
<province name="江苏省">
    <city name="盐城市">
      <county name="建湖县">
      </county>
      <county name="盐城县">
      </county>
    </city>
    <city name="南通市">
      <county name="海安县">
      </county>
      <county name="如东县">
      </county>
    </city>
    <city name="扬州市">
      <county name="宝应县">
      </county>
    </city>
</province>
<province name="广东省">
    <city name="潮州市">
      <county name="潮安县">
      </county>
    </city>
    <city name="河源市">
      <county name="东源县">
      </county>
      <county name="和平县">
      </county>
    </city>
</province>
</WebService>

WebService.cs:

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

/// <summary>
/// WebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {

    public WebService () //类的构造函数。
    {
    }

private static XmlDocument xmlDoc;//申明一个XmlDocument的对象xmlDoc;
private static object objectLock = new object();//创建一个对象。

    public static XmlDocument Document
    {
        get //使用get方法。
        {
            lock (objectLock) //只能单线程使用，相当于在操作锁定。
            {
                if (xmlDoc == null)
                {
                    xmlDoc = new XmlDocument();//对对象初始化、
                    xmlDoc.Load(HttpContext.Current.Server.MapPath("~/App_Data/XML.xml"));
                }
            }
            return xmlDoc;
        }
    }

    public static string[] Hierarchy
    {
        get { return new string[] { "province", "city" }; }
    }

    [WebMethod]
    public AjaxControlToolkit.CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category)
    {
        StringDictionary knownCategoryValuesDictionary = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
        return AjaxControlToolkit.CascadingDropDown.QuerySimpleCascadingDropDownDocument(Document, Hierarchy, knownCategoryValuesDictionary, category);
    }

}

Webservice.asmx:

<%@ WebService Language="C#" CodeBehind="~/App_Code/WebService.cs" Class="WebService" %>