利用Asp.Net AJAX的CascadingDropDown控制項結合Web Service來讀取資料

利用Asp.Net AJAX的CascadingDropDown控制項結合Web Service來讀取資料

這個範例主要是利用Web Service結合AJAX的CascadingDropDown控制項來讀取資料

CascadingDropDown_CS.aspx

01 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CascadingDropDown_CS.aspx.cs"
02     Inherits="CascadingDropDown_CS" %>
03
04 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
05 <html xmlns="http://www.w3.org/1999/xhtml">
06 <head id="Head1" runat="server">
07     <title>未命名頁面</title>
08 </head>
09 <body>
10     <form id="form1" runat="server">
11         <asp:ScriptManager ID="ScriptManager1" runat="server">
12         </asp:ScriptManager>
13         <asp:DropDownList ID="DropDownList1" runat="server">
14         </asp:DropDownList>
15         <asp:DropDownList ID="DropDownList2" runat="server">
16         </asp:DropDownList>
17         <ajaxtoolkit:cascadingdropdown id="CascadingDropDown1" runat="server" category="ClassA"
18             loadingtext="載入中..." prompttext="請選擇" servicemethod="GetDropDownContentsPageMethod"
19             targetcontrolid="DropDownList1">
20 </ajaxtoolkit:cascadingdropdown>
21         <ajaxtoolkit:cascadingdropdown id="CascadingDropDown2" runat="server" category="ClassB"
22             loadingtext="載入中..." prompttext="請選擇" servicemethod="GetDropDownContentsPageMethod"
23             targetcontrolid="DropDownList2" parentcontrolid="DropDownList1">
24 </ajaxtoolkit:cascadingdropdown>
25     </form>
26 </body>
27 </html>
28


CascadingDropDown_CS.aspx.cs

01 using System;
02 using System.Data;
03 using System.Configuration;
04 using System.Collections;
05 using System.Web;
06 using System.Web.Security;
07 using System.Web.UI;
08 using System.Web.UI.WebControls;
09 using System.Web.UI.WebControls.WebParts;
10 using System.Web.UI.HtmlControls;
11 using System.Web.Services;
12 using AjaxControlToolkit;

13
14 public partial class CascadingDropDown_CS : System.Web.UI.Page
15 {
16     protected void Page_Load(object sender, EventArgs e)
17     {
18
19     }

20
21     [WebMethod]
22     [System.Web.Script.Services.ScriptMethod]
23     public static CascadingDropDownNameValue[] GetDropDownContentsPageMethod(string knownCategoryValues, string category)
24     {
25         return new WebService().GetDropDownContents(knownCategoryValues, category);
26     }

27 }


在App_Code裡加入一個WebService.cs檔
WebService.cs

01 using System;
02 using System.Web;
03 using System.Collections;
04 using System.Web.Services;
05 using System.Web.Services.Protocols;
06 using AjaxControlToolkit;
07 using System.Collections.Generic;
08 using System.Collections.Specialized;

09
10 /// <summary>
11 /// WebService 的摘要描述
12 /// </summary>
13 [WebService(Namespace = "http://tempuri.org/")]
14 [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
15 public class WebService : System.Web.Services.WebService
16 {
17
18     public WebService()
19     {
20
21         //如果使用設計的元件,請取消註解下行程式碼
22         //InitializeComponent();
23     }

24
25     [WebMethod]
26     public CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category)
27     {
28
29         List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
30
31         if (category == "ClassA")
32         {
33             values.Add(new CascadingDropDownNameValue("ClassA-1", "1"));
34             values.Add(new CascadingDropDownNameValue("ClassA-2", "2"));
35             values.Add(new CascadingDropDownNameValue("ClassA-3", "3"));
36         }

37
38         if (category == "ClassB")
39         {
40             StringDictionary kv = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
41
42             int modelId;
43             if (!kv.ContainsKey("ClassA") || !Int32.TryParse(kv["ClassA"], out modelId))
44             {
45                 return null;
46             }

47
48             //選擇ClassA的第1個項目
49             if (modelId == 1)
50             {
51                 values.Add(new CascadingDropDownNameValue("ClassA-1,ClassB-1", "1"));
52                 values.Add(new CascadingDropDownNameValue("ClassA-1,ClassB-2", "2"));
53                 values.Add(new CascadingDropDownNameValue("ClassA-1,ClassB-3", "3"));
54             }

55
56             //選擇ClassA的第2個項目
57             if (modelId == 2)
58             {
59                 values.Add(new CascadingDropDownNameValue("ClassA-2,ClassB-1", "1"));
60                 values.Add(new CascadingDropDownNameValue("ClassA-2,ClassB-2", "2"));
61                 values.Add(new CascadingDropDownNameValue("ClassA-2,ClassB-3", "3"));
62             }

63
64             //選擇ClassA的第3個項目
65             if (modelId == 3)
66             {
67                 values.Add(new CascadingDropDownNameValue("ClassA-3,ClassB-1", "1"));
68                 values.Add(new CascadingDropDownNameValue("ClassA-3,ClassB-2", "2"));
69                 values.Add(new CascadingDropDownNameValue("ClassA-3,ClassB-3", "3"));
70             }

71
72         }

73
74         return values.ToArray();
75     }

76
77 }


GetDropDownContents方法可以改為兩種方式來讀取資料:
1.利用資料庫
2.利用XML