省市联动下拉菜单的实现

Posted 2020-10-17 素年，锦时

                                                                                             省市联动下拉菜单的实现
一、数据库的建立
为了更好的实现与数据库连接，省表中需要有两个元素，一个是省编号，一个是省名称；市表中需要有三个元素，一个是市编号，一个是市名称，更重要的是这个市改隶属于那个省。
省表（UserProvince）
ProID    ProName
1            河南
2            安徽
市表（UserCity）
CityID    ProID    CityName
1              1         郑州
2              2         合肥

二、代码
后台：（定义两个关于省市的的函数，通过SelectedIndexChanged事件实现对市的筛选）
protected void Page_Load(object sender, EventArgs e)
    {
            BindProvince();
            BindCity();
        }
 private void BindProvince()
        {
            string sql = "select ProID,ProName from UserProvince";
            SqlConnection conn = new SqlConnection("SqlDataSource1");
            SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);
            DataSet ds = new DataSet();
            conn.Open();
            adapter.Fill(ds);
            conn.Close();
            ddlprovince.DataSource = ds.Tables[0];
            ddlprovince.DataValueField = "ProID";
            ddlprovince.DataTextField = "ProName";
            ddlprovince.DataBind();
        }
        private void BindCity()
        {
            string sql = "select CityID,ProID,CityName from UserCity; ";
            SqlConnection conn = new SqlConnection("SqlDataSource2");
            SqlDataAdapter adapter = new SqlDataAdapter(sql, conn);
            DataSet ds = new DataSet();
            conn.Open();
            adapter.Fill(ds);
            conn.Close();
            ddlCity.DataSource = ds.Tables[0];
            ddlCity.DataValueField = "CityID";
            ddlCity.DataTextField = "CityName";
            ddlCity.DataBind();
        }
protected void ddlprovince_SelectedIndexChanged(object sender, EventArgs e)
    {
       
            int ProID = this.ddlprovince.SelectedIndex + 1;
            SqlConnection conn = new SqlConnection();
            conn.ConnectionString = "User ID=sa;Initial Catalog=News;Data Source= (local);Password=123";
            conn.Open();
            SqlCommand cmd = new SqlCommand("select * from [News].[dbo].[UserCity] where ProID=‘"+ProID+"‘");
            cmd.Connection = conn;
            SqlDataReader sdr = cmd.ExecuteReader();
            //绑定
            this.ddlCity.DataSource = sdr;
            this.ddlCity.DataTextField = "CityName";
            this.ddlCity.DataValueField = "CityID";
            this.ddlCity.DataBind();
            sdr.Close();
            conn.Close();
        }
}
前台：（两个连接数据库的DropDownList控件）
 <asp:DropDownList ID="ddlprovince" runat="server" widtn="55px" DataSourceID="SqlDataSource1" DataTextField="proName" DataValueField="proID" AutoPostBack="True" OnSelectedIndexChanged="ddlprovince_SelectedIndexChanged">
                                    </asp:DropDownList>
                                    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString2 %>" SelectCommand="SELECT [proID], [proName] FROM [Userprovince]"></asp:SqlDataSource>
                                    <asp:DropDownList ID="ddlCity" runat="server" widtn="55px"  DataTextField="cityName" DataValueField="cityID" AutoPostBack="True">
                                    </asp:DropDownList>
                                    <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:NewsConnectionString3 %>" SelectCommand="SELECT [cityID], [proID], [cityName] FROM [UserCity]"></asp:SqlDataSource>