Ajax实现无刷新三联动下拉框

1.html代码

< HTML >
     < HEAD >
         < title > Ajax实现无刷新三联动下拉框 </ title >
         < meta  content ="Microsoft Visual Studio .NET 7.1"  name ="GENERATOR" >
         < meta  content ="C#"  name ="CODE_LANGUAGE" >
         < meta  content ="JavaScript"  name ="vs_defaultClientScript" >
         < meta  content ="http://schemas.microsoft.com/intellisense/ie5"  name ="vs_targetSchema" >
         < SCRIPT  language ="javascript" >             
            //城市------------------------------
            function cityResult() 
            { 
                var city=document.getElementById("DropDownList1");
                AjaxMethod.GetCityList(city.value,get_city_Result_CallBack);
            }
            
            function get_city_Result_CallBack(response)
            {
                if (response.value != null)
                {                    
                    document.all("DropDownList2").length=0;
　　　　            var piArray = response.value.split(",");
　　　　            for(var i=0;i<piArray.length;i++)
　　　　            {
　　　　　　            var ary1 = piArray[i].toString().split("|");
　　　　　　            document.all("DropDownList2").options.add(new Option(ary1[1].toString(),ary1[0].toString()));
　　　　            }                
                }                
                return
            }
            //市区----------------------------------------
            function areaResult() 
            { 
                var area=document.getElementById("DropDownList2");
                AjaxMethod.GetAreaList(area.value,get_area_Result_CallBack);
            }
            function get_area_Result_CallBack(response)
            {
                if (response.value != null)
                {                    
                    document.all("DropDownList3").length=0;
　　　　            var piArray = response.value.split(",");
　　　　            for(var i=0;i<piArray.length;i++)
　　　　            {
　　　　　　            var ary1 = piArray[i].toString().split("|");
　　　　　　            document.all("DropDownList3").options.add(new Option(ary1[1].toString(),ary1[0].toString()));
　　　　            }                
                }                
                return
            }
            function getData()
            {
                var province=document.getElementById("DropDownList1");
                var pindex = province.selectedIndex;
                var pValue = province.options[pindex].value;
                var pText  = province.options[pindex].text;
                
                var city=document.getElementById("DropDownList2");
                var cindex = city.selectedIndex;
                var cValue = city.options[cindex].value;
                var cText  = city.options[cindex].text;
                
                var area=document.getElementById("DropDownList3");
                var aindex = area.selectedIndex;
                var aValue = area.options[aindex].value;
                var aText  = area.options[aindex].text;
                
                var txt=document.getElementById("TextBox1");                                

                document.getElementById("<%=TextBox1.ClientID%>").innerText="省:"+pValue+"|"+pText+"市:"+cValue+"|"+cText+"区:"+aValue+"|"+aText;
            }
         </ SCRIPT >
     </ HEAD >
     < body  ms_positioning ="GridLayout" >
         < form  id ="Form1"  method ="post"  runat ="server" >
             < TABLE  id ="Table1"  style ="Z-INDEX: 101; LEFT: 96px; POSITION: absolute; TOP: 32px"  cellSpacing ="1"
                cellPadding ="1"  width ="300"  border ="1"  bgColor ="#ccff66" >
                 < TR >
                     < TD > 省市 </ TD >
                     < TD >< asp:dropdownlist  id ="DropDownList1"  runat ="server" ></ asp:dropdownlist ></ TD >
                 </ TR >
                 < TR >
                     < TD > 城市 </ TD >
                     < TD >< asp:dropdownlist  id ="DropDownList2"  runat ="server" ></ asp:dropdownlist ></ TD >
                 </ TR >
                 < TR >
                     < TD > 市区 </ TD >
                     < TD >< asp:dropdownlist  id ="DropDownList3"  runat ="server" ></ asp:dropdownlist ></ TD >
                 </ TR >
             </ TABLE >
             < asp:TextBox  id ="TextBox1"  style ="Z-INDEX: 102; LEFT: 416px; POSITION: absolute; TOP: 48px"  runat ="server"
                Width ="424px" ></ asp:TextBox >< INPUT  style ="Z-INDEX: 103; LEFT: 456px; WIDTH: 56px; POSITION: absolute; TOP: 96px; HEIGHT: 24px"
                type ="button"  value ="test"  onclick ="getData();" >
         </ form >
     </ body >
</ HTML >

2.cs代码

public   class  AjaxDropDownList : System.Web.UI.Page
     {
        protected System.Web.UI.WebControls.DropDownList DropDownList1;
        protected System.Web.UI.WebControls.DropDownList DropDownList2;
        protected System.Web.UI.WebControls.TextBox TextBox1;
        protected System.Web.UI.WebControls.DropDownList DropDownList3;
    
        private void Page_Load(object sender, System.EventArgs e)
        {    
            Ajax.Utility.RegisterTypeForAjax(typeof(AjaxMethod));
            if(!Page.IsPostBack)
            {
                this.DropDownList1.DataSource=AjaxMethod.GetPovinceList();
                this.DropDownList1.DataTextField="province";
                this.DropDownList1.DataValueField="provinceID";
                this.DropDownList1.DataBind();
                
                this.DropDownList1.Attributes.Add("onchange","cityResult();");
                this.DropDownList2.Attributes.Add("onchange","areaResult();");
            }
        }

        Web Form Designer generated code#region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            //
            InitializeComponent();
            base.OnInit(e);
        }
        
        /**//// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {    
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion        
    }

3.AjaxMethod

public   class  AjaxMethod
     {        
        public static string ConnectionString=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
    
        GetDataSet#region GetDataSet
        public static DataSet GetDataSet(string sql)
        {
            SqlDataAdapter    sda =new SqlDataAdapter(sql,ConnectionString);
            DataSet ds=new DataSet();
            sda.Fill(ds);
            return ds;
        }
        #endregion

        GetPovinceList#region GetPovinceList
        public static DataSet GetPovinceList()
        {
            string sql="select * from povince";
            return GetDataSet(sql);
        }
        #endregion

        GetCityList#region GetCityList
        [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
        public static string GetCityList(int povinceid)
        {
            string sql="select * from city where father="+povinceid;
            DataSet ds=GetDataSet(sql);
            string str="";
            for(int m=0;m<ds.Tables[0].Rows.Count;m++)
            {
                str+=","+ds.Tables[0].Rows[m]["cityID"].ToString()+"|"+ds.Tables[0].Rows[m]["city"].ToString();
            }
            str=str.Substring(1,str.Length-1);
            return str;
        }
        #endregion

        GetAreaList#region GetAreaList
        [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
        public static string GetAreaList(int cityid)
        {
            string sql="select * from area where father="+cityid;
            DataSet ds=GetDataSet(sql);
            string str="";
            for(int m=0;m<ds.Tables[0].Rows.Count;m++)
            {
                str+=","+ds.Tables[0].Rows[m]["areaID"].ToString()+"|"+ds.Tables[0].Rows[m]["area"].ToString();
            }
            str=str.Substring(1,str.Length-1);
            return str;
        }
        #endregion
    }

4.数据库 /Files/singlepine/area.rar
5.Ajax.dll /Files/singlepine/Ajax.rar
6."XmlHttp实现无刷新三联动下拉框" http://singlepine.cnblogs.com/articles/265678.html