Ajax无刷新技术实现省市县易做图联动下拉菜单--Asp.Net

开始工作。

第一步：准备好数据，中国省市县行政区域编码做好三张表，分别是province表，sity表，area表，上截图:,这三张表，主要有code，和name两个字段，code用来存储区域编码，name用来存储行政区域名字，当然了还有个Id主键，自增长，我们利用code来判断依赖关系。

第二步：数据库和表做好之后呢，就可以写代码了，先拖一个ScriptManager控件和一个UpdatePanel控件，这两个控件是用来实现无刷新技术的，非常方便。接着拖3个DropDownList控件，一定要注意，要放在UpdatePanel控件的ContentTemplate里面，看看代码：

?<form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:DropDownList ID="ddl_Province" runat="server" AutoPostBack="True" onselectedindexchanged="ddl_Province_SelectedIndexChanged">
                </asp:DropDownList>
                <asp:DropDownList ID="ddl_City" runat="server" AutoPostBack="True" onselectedindexchanged="ddl_City_SelectedIndexChanged">
                </asp:DropDownList>
                <asp:DropDownList ID="ddl_Area" runat="server">
                </asp:DropDownList>
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
写到这儿，就写有关数据库相关的代码就好了，非常简单的。

第三步：后台代码：

在后台代码里，我写了三个方法，BindProvince(),BindCity(),BindArea(),这三个方法如其名所说是用来绑定省市县的三个下拉菜单的，方法很简单，看代码：

        private void BindProvince()
        {
            string sql = "select code,name from province";
            SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
            SqlDataAdapter adapter = new SqlDataAdapter(sql,conn);
            DataSet ds = new DataSet();
            conn.Open();
            adapter.Fill(ds);
            conn.Close();
            ddl_Province.DataSource = ds.Tables[0];
            ddl_Province.DataValueField = "code";
            ddl_Province.DataTextField = "name";
            ddl_Province.DataBind();
        }
        private void BindCity(string code)
        {
            string provinceCode = code.Substring(0, 2);
            string sql = "select code,name from city where left(code,2)='"+ provinceCode +"'";
            SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
            SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);
            DataSet ds = new DataSet();
            conn.Open();
            adapter.Fill(ds);
            conn.Close();
            ddl_City.DataSource = ds.Tables[0];
            ddl_City.DataValueField = "code";
            ddl_City.DataTextField = "name";
            ddl_City.DataBind();
        }

        private void BindArea(string code)
        {
            string cityCode = code.Substring(0, 4);
            string sql = "select code,name from area where left(code,4)='" + cityCode + "'";
            SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
            SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);
            DataSet ds = new DataSet();
            conn.Open();
            adapter.Fill(ds);
            conn.Close();
            ddl_Area.DataSource = ds.Tables[0];
            ddl_Area.DataValueField = "code";
            ddl_Area.DataTextField = "name";
            ddl_Area.DataBind();
        }接着就是在下拉菜单的SelectedIndexChanged事件处理方法上写上这几个方法了，代码如下：

protected void ddl_City_SelectedIndexChanged(object sender, EventArgs e)
        {
            BindArea(ddl_City.SelectedItem.Value);
        }

        protected void ddl_Province_SelectedIndexChanged(object sender, EventArgs e)
        {
            BindCity(ddl_Province.SelectedItem.Value);
   &nbs

补充：Web开发 , ASP.Net ,