你的位置:首页 > ASP.net教程

[ASP.net教程]webForm(三)——三级联动


三级联动

首先附图一张,初步认识一下什么是三级联动:

                         

注:选第一个后面两个变,选第二个,最后一个改变。

      其次,做三级联动需要注意的方面:①DropDownList中的一个属性——AutoPostBack:是否发生自动回传到服务器的操作。如果把该属性设置为 TRUE,则启用自动回传,否则为 FALSE。默认是 FALSE,在此需要true。

                                                   ②绑定数据:封装一个抽象的方法,灵活运用

      例:web实现省市区三级联动(方法有两种,个人推荐第一种;第二种,代码量多一些)

      注:在此链接数据库的类就不做呈现,但提示一点:数据库根据父级代号条件写查询 返回list<>集合。

       法一:

web中创建三个下拉列表框(DropDownList)

<form id="form1" runat="server">    <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"></asp:DropDownList>    <asp:DropDownList ID="DropDownList2" runat="server" AutoPostBack="True"></asp:DropDownList>    <asp:DropDownList ID="DropDownList3" runat="server" AutoPostBack="True"></asp:DropDownList><br />      </form>

CS:※SelectedIndexChanged事件:当列表控件的选定项在信息发往服务器之间变化时发生

public partial class Default3 : System.Web.UI.Page{  ChinaDA da = new ChinaDA();  protected void Page_Load(object sender, EventArgs e)  {    if (!IsPostBack)    {      Bind(DropDownList1 ,new ChinaDA().Select( "0001"));//填充省      Bind(DropDownList2, new ChinaDA().Select(DropDownList1.SelectedValue));//填充市      Bind(DropDownList3, new ChinaDA().Select(DropDownList2.SelectedValue));//填充区    }    DropDownList1.SelectedIndexChanged += DropDownList1_SelectedIndexChanged;//省改变事件    DropDownList2.SelectedIndexChanged += DropDownList2_SelectedIndexChanged;//市改变事件      }  public void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)  {     Bind(DropDownList3, new ChinaDA().Select(DropDownList2.SelectedValue));  }  public void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)  {    Bind(DropDownList2, new ChinaDA().Select(DropDownList1.SelectedValue));    Bind(DropDownList3, new ChinaDA().Select(DropDownList2.SelectedValue));  }  private void Bind(DropDownList dd, List<China> list)  {    dd.DataSource = list;    dd.DataTextField = "Name";    dd.DataValueField = "Code";    dd.DataBind();  }}

法二:

创建三个下拉列表框(DropDownList)

省:<asp:DropDownList ID="DropDownListsheng" runat="server" OnSelectedIndexChanged="DropDownListsheng_SelectedIndexChanged" AutoPostBack="True"></asp:DropDownList> 市:<asp:DropDownList ID="DropDownListshi" runat="server" OnSelectedIndexChanged="DropDownListshi_SelectedIndexChanged" AutoPostBack="True"></asp:DropDownList> 区:<asp:DropDownList ID="DropDownListqu" runat="server" AutoPostBack="True"></asp:DropDownList>

CS:※DropDownList.Items.Clear(); 每调用一次填充方法就需要请空一下,否则数据会追加

protected void Page_Load(object sender, EventArgs e)  {    if (!IsPostBack)    {      sheng();      shi();      qu();    }       }  public void sheng()//填充省  {    List<ChinaStates> listsheng = new ChinaStatesDA().Select("0001");    foreach (ChinaStates cssheng in listsheng)    {      ListItem lisheng = new ListItem(cssheng.AreaName, cssheng.AreaCode);      DropDownListsheng.Items.Add(lisheng);    }  }  public void shi()//填充市  {    List<ChinaStates> listshi = new ChinaStatesDA().Select(DropDownListsheng.SelectedValue);    foreach (ChinaStates csshi in listshi)    {      ListItem lishi = new ListItem(csshi.AreaName, csshi.AreaCode);      DropDownListshi.Items.Add(lishi);    }  }  public void qu()//填充区  {    List<ChinaStates> listqu = new ChinaStatesDA().Select(DropDownListshi.SelectedValue);    foreach (ChinaStates csqu in listqu)    {      ListItem liqu = new ListItem(csqu.AreaName, csqu.AreaCode);      DropDownListqu.Items.Add(liqu);    }  }  protected void DropDownListsheng_SelectedIndexChanged(object sender, EventArgs e)  {    DropDownListshi.Items.Clear();    DropDownListqu.Items.Clear();    shi();    qu();  }  protected void DropDownListshi_SelectedIndexChanged(object sender, EventArgs e)  {    DropDownListqu.Items.Clear();    qu();  }