<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    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)
                    {                    
                        //debugger;
                        document.all("DropDownList2").length=0;                
                    var ds = response.value;
                        if(ds != null && typeof(ds) == "object" && ds.Tables != null)
                        {                    
                            for(var i=0; i<ds.Tables[0].Rows.length; i++)
                        {
                            var name=ds.Tables[0].Rows[i].city;
                          var id=ds.Tables[0].Rows[i].cityID;
                          document.all("DropDownList2").options.add(new Option(name,id));
                        }
                        }
                    }                
                    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 ds = response.value;
                        if(ds != null && typeof(ds) == "object" && ds.Tables != null)
                        {                    
                            for(var i=0; i<ds.Tables[0].Rows.length; i++)
                        {
                          var name=ds.Tables[0].Rows[i].area;
                          var id=ds.Tables[0].Rows[i].areaID;
                          document.all("DropDownList3").options.add(new Option(name,id));
                        }                
                        }
                    }
                    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代碼
    using System;
    using System.Collections;
    using System.ComponentModel;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.SessionState;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    namespace AjaxTest
    {
        /**//// <summary>
        /// Summary description for WebForm1.
        /// </summary>
        public class WebForm1 : 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.GetProvinceList();
                    this.DropDownList1.DataTextField="province";
                    this.DropDownList1.DataValueField="provinceID";
                    this.DropDownList1.DataBind();
                    
                    this.DropDownList1.Attributes.Add("onclick","cityResult();");
                    this.DropDownList2.Attributes.Add("onclick","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
    using System;
    using System.Data;
    using System.Data.SqlClient;
    namespace AjaxTest
    {
        /**//// <summary>
        /// Summary description for AjaxMethod.
        /// </summary>
        public class AjaxMethod
        {
            GetProvinceList#region GetProvinceList
            public static DataSet GetProvinceList()
            {
                string sql="select * from province";
                return GetDataSet(sql);
            }
            #endregion

            GetCityList#region GetCityList
            [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
            public  DataSet GetCityList(int provinceid)
            {
                string sql="select * from city where father="+provinceid;
                return GetDataSet(sql);            
            }
            #endregion

            GetAreaList#region GetAreaList
            [Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
            public  DataSet GetAreaList(int cityid)
            {
                string sql="select * from area where father="+cityid;
                return GetDataSet(sql);            
            }
            #endregion
        
            GetDataSet#region GetDataSet
            public static DataSet GetDataSet(string sql)
            {
                string ConnectionString=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
                SqlDataAdapter    sda =new SqlDataAdapter(sql,ConnectionString);
                DataSet ds=new DataSet();
                sda.Fill(ds);
                return ds;
            }
            #endregion
        }
    }
    4.web.config
    <httpHandlers>
                <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
        </httpHandlers>
    5.ajax.dll下載/Files/singlepine/Ajax.rar
    6.真實數據庫下載area1.rar
    7.源代碼下載AjaxTest.rar

    posted on 2007-06-20 13:17 chenguo 閱讀(244) 評論(0)  編輯  收藏 所屬分類: AJAX Dev

    <2025年5月>
    27282930123
    45678910
    11121314151617
    18192021222324
    25262728293031
    1234567

    導航

    統計

    留言簿

    隨筆分類(1)

    文章分類(52)

    好友 小山的博客

    最新隨筆

    最新評論

    主站蜘蛛池模板: 国产亚洲精品岁国产微拍精品| 亚洲成人福利在线| 中文字幕在线免费观看| 自拍偷区亚洲国内自拍| 免费a级黄色毛片| 亚洲精品免费观看| 亚洲欧美熟妇综合久久久久| 2048亚洲精品国产| 国产精品久久久久久久久免费| 鲁死你资源站亚洲av| 亚洲国产成人片在线观看| 永久免费毛片在线播放| 国产高潮久久免费观看| 亚洲第一成年网站大全亚洲| 国产男女性潮高清免费网站| 午夜不卡久久精品无码免费| 亚洲av无码专区在线观看亚| 婷婷亚洲综合五月天小说| 日本高清免费不卡在线| 久久免费的精品国产V∧| 亚洲av乱码中文一区二区三区| 亚洲av无码一区二区三区乱子伦| 成人au免费视频影院| 久久久久国色av免费看| 美女又黄又免费的视频| 亚洲最大黄色网址| 亚洲日韩小电影在线观看| 狠狠久久永久免费观看| 最近2019中文字幕免费大全5| 一级毛片高清免费播放| 97久久国产亚洲精品超碰热| 久久亚洲精品中文字幕三区| 国产成人aaa在线视频免费观看 | 国产综合免费精品久久久| 亚洲日韩AV一区二区三区中文| 久久久久亚洲av无码专区蜜芽 | 精品日韩亚洲AV无码一区二区三区 | 久久久久亚洲AV片无码下载蜜桃| 亚洲国产专区一区| 最近的中文字幕大全免费版| 久久久免费精品re6|