代码改变世界

AjaxControlTooklit +WebService+XML省市县三级联动

2011-07-14 21:50  AlexDotNet  阅读(336)  评论(0编辑  收藏  举报

 最近因为项目需要需要个省市县的三级联动,因为本人是菜鸟,..嘻嘻!因为要做无刷新的联动..所以想到了Ajax 因为没有用 Asp.Net 自带的Ajax

于是乎就想到了用 AjaxControlTooklit 这个控件

目前 版本有 3.5 和4.0 下载地址我就不发了..

我用的是 4.0的

我的平台是 VS2010

新建个webapplication 空项目

添加 一个WebService 取名为WebServiceCity

View Code
 1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" EnableEventValidation="false"
2 Inherits="WebApplication3.WebForm1" %>
3
4 <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
6 <html xmlns="http://www.w3.org/1999/xhtml">
7 <head runat="server">
8 <title></title>
9 </head>
10 <body>
11 <form id="form1" runat="server">
12 <ajaxToolkit:ToolkitScriptManager runat="server" EnablePartialRendering="true" ID="ScriptManager1" />
13 <asp:DropDownList ID="DropDownList1" runat="server" Width="170" />
14 <asp:DropDownList ID="DropDownList2" runat="server" Width="170" />
15 <asp:DropDownList ID="DropDownList3" runat="server" Width="170" AutoPostBack="true"
16 OnSelectedIndexChanged="DropDownList3_SelectedIndexChanged" />
17 <div>
18 <ajaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1"
19 Category="province" PromptText="请选择省份" LoadingText="[加载中...]" ServicePath="WebServiceCity.asmx"
20 ServiceMethod="GetDropDownContents" />
21 <ajaxToolkit:CascadingDropDown ID="CascadingDropDown2" runat="server" TargetControlID="DropDownList2"
22 Category="city" PromptText="请选择市" LoadingText="[加载中...]" ServiceMethod="GetDropDownContentsPageMethod"
23 ParentControlID="DropDownList1" />
24 <ajaxToolkit:CascadingDropDown ID="CascadingDropDown3" runat="server" TargetControlID="DropDownList3"
25 Category="country" PromptText="请选择区(县)" LoadingText="[加载中...]" ServicePath="../WebServiceCity.asmx"
26 ServiceMethod="GetDropDownContents" ParentControlID="DropDownList2" />
27 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="inline">
28 <ContentTemplate>
29 <asp:Label ID="Label1" runat="server" Text="[No response provided yet]" />
30 </ContentTemplate>
31 <Triggers>
32 <asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
33 </Triggers>
34 </asp:UpdatePanel>
35 </div>
36 </form>
37 </body>
38 </html>

注意:EnableEventValidation="false"

后台方法:
Code
 1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.Services;
6 using System.Web.UI;
7 using System.Web.UI.WebControls;
8 using AjaxControlToolkit;
9
10 namespace WebApplication3
11 {
12 public partial class WebForm1 : System.Web.UI.Page
13 {
14 protected void Page_Load(object sender, EventArgs e)
15 {
16
17 }
18 [WebMethod]
19 [System.Web.Script.Services.ScriptMethod]
20 public static CascadingDropDownNameValue[] GetDropDownContentsPageMethod(string knownCategoryValues, string category)
21 {
22 return new WebServiceCity().GetDropDownContents(knownCategoryValues, category);
23 }
24
25 protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
26 {
27 string province = DropDownList1.SelectedItem.Text;
28 string city = DropDownList2.SelectedItem.Text;
29 string country = DropDownList3.SelectedItem.Text;
30 if (string.IsNullOrEmpty(province))
31 {
32 Label1.Text = "请选择个省";
33 }
34 else if (string.IsNullOrEmpty(city))
35 {
36 Label1.Text = "请选择个市";
37 }
38 else if (string.IsNullOrEmpty(country))
39 {
40 Label1.Text = "请选择区或者县";
41 }
42 else
43 {
44 Label1.Text = string.Format("你所选择的是 {0} {1} {2}. ", province, city, country);
45 }
46 }
47 }
48 }

这样基本就搞定了..

Demo