省市区三级无刷新联动效果示例代码

 

 

前台:


 
               
               

                案例一：省市区三级无刷新联动

               

               

               
                   
                        省份                     DataTextField="AreaName" DataValueField="AreaId"
                    onselectedindexchanged="ddlProvince_SelectedIndexChanged">
                       
                         城市
                                            DataTextField="AreaName" DataValueField="AreaId"
                    onselectedindexchanged="ddlCity_SelectedIndexChanged">
                       
                         区县
                                            DataValueField="AreaId" >
                       

                        

                        

                          籍贯

                   
                 



后台:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplicationUI
{
    public partial class Content : System.Web.UI.Page
    {
        //(1)登录事件
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                bindProvince();
                bindCityByProvinceID();
                bindAreaByCityID();
            }
        }

       

       //(2)当省份下拉改变的时候城市数据源重新进行绑定
        protected void ddlCity_SelectedIndexChanged(object sender, EventArgs e)
        {
            bindAreaByCityID();

            txtJiGuan.Text = ddlProvince.SelectedItem.Text + "-" + ddlCity.SelectedItem.Text + "-" + ddlRegion.SelectedItem.Text;

        }

       

       //(3)当省份下拉进行改变的时候
        protected void ddlProvince_SelectedIndexChanged(object sender, EventArgs e)
        {
            bindCityByProvinceID();
            bindAreaByCityID();

            txtJiGuan.Text = ddlProvince.SelectedItem.Text + "-" + ddlCity.SelectedItem.Text + "-" + ddlRegion.SelectedItem.Text;
        }

        //(4)绑定省份数据
        void bindProvince()
        {
            ddlProvince.DataSource = BLL.Region.getProvince();
            ddlProvince.DataBind();

            // ddlProvince.Items.Add("全部");//dropdown末尾添加全部选项

        }
        //(5)通过省份ID绑定市数据源
        void bindCityByProvinceID()
        {
            ddlCity.DataSource = BLL.Region.getCity(ddlProvince.SelectedIndex + 1);
            ddlCity.DataBind();
        }
        //(6)通过市ID绑定区域数据源
        void bindAreaByCityID()
        {
            //这里注意后面的参数是要取绑定的市的Value值，因为省市区三级联动表是父子关系表
            ddlRegion.DataSource = BLL.Region.getRegion(Convert.ToInt32( ddlCity.SelectedValue ));
            ddlRegion.DataBind();
        }
    }
}