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 WebApplication1
{
/// <summary>
/// Summary description for WebForm1.
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DropDownList ddl1;
protected System.Web.UI.WebControls.DropDownList ddl2;
protected System.Web.UI.WebControls.DropDownList ddl3;
protected System.Web.UI.WebControls.DropDownList ddl4;
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
}
#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.ddl1.SelectedIndexChanged += new System.EventHandler(this.ddl1_SelectedIndexChanged);
this.ddl3.SelectedIndexChanged += new System.EventHandler(this.ddl3_SelectedIndexChanged);
this.ddl2.SelectedIndexChanged += new System.EventHandler(this.ddl2_SelectedIndexChanged);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void ddl1_SelectedIndexChanged(object sender, System.EventArgs e)
{
ddl2.SelectedIndex = ddl1.SelectedIndex;
ddl2_SelectedIndexChanged(ddl2,null);
}
private void ddl2_SelectedIndexChanged(object sender, System.EventArgs e)
{
ddl3.SelectedIndex = ddl2.SelectedIndex;
ddl3_SelectedIndexChanged(ddl3,null);
}
private void ddl3_SelectedIndexChanged(object sender, System.EventArgs e)
{
ddl4.SelectedIndex = ddl3.SelectedIndex;
}
}
}
我这个可行,写在一起了,没用code-behind,直接复制过去就能运行了,没数据库支持
<%@ Page Language= "C# " %>
<%@ Register Assembly= "MagicAjax " Namespace= "MagicAjax.UI.Controls " TagPrefix= "ajax " %>
<%@ Import Namespace= "System.Data " %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<script runat= "server ">
void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack) {
// Load default Provinces and Cities.
LoadProvinceData();
LoadCityData();
LoadDistrictData();
}
}
#region event handler(s)
void drpCountry_SelectedIndexChanged(object sender, EventArgs e)
{
LoadProvinceData();
LoadCityData();
LoadDistrictData();
}
void drpProvince_SelectedIndexChanged(object sender, EventArgs e)
{
LoadCityData();
LoadDistrictData();
}
void drpCity_SelectedIndexChanged(object sender, EventArgs e)
{
LoadDistrictData();
}
#endregion
#region private helpers
void LoadProvinceData()
{
DataTable dtProvince = new DataTable();// null;
// In this demo, we just provider provinces for Chinese
if (drpCountry.SelectedValue.ToLower() == "cn ") {
// In your case, maybe you like to populate the Province data
// from the back-end datastore such as database.
dtProvince = CreateProvinceTable();
}
drpProvince.DataSource = dtProvince;
drpProvince.DataBind();
}
void LoadCityData()
{
// In your case, maybe you perform the search in your database
// by ADO.NET with inner-sql or stored procedure.
DataTable dtCity = CreateCityTable();
DataView dvCity = dtCity.DefaultView;
// Providers a dummy ProvincId when there are none of provinces to select.
string selectedProvinceId = (drpProvince.SelectedValue.Length != 0) ? drpProvince.SelectedValue : "-1 ";
dvCity.RowFilter = "ProvinceID= " + selectedProvinceId;
drpCity.DataSource = dvCity;
drpCity.DataBind();
}
void LoadDistrictData()
{
// Clears the items
drpDistrict.Items.Clear();
// In this demo, we just only provider districts for Chongqing city.
if (drpCity.SelectedValue != "5 ") return;
//
ListItem item = null;
//
item = new ListItem( "Shapingba ", "1 ");
drpDistrict.Items.Add(item);
//
item = new ListItem();
item.Text = "Yuzhongqu ";
item.Value = "2 ";
item.Selected = true;
drpDistrict.Items.Add(item);
//
drpDistrict.Items.Add(new ListItem( "Jiangbei ", "3 "));
}
#endregion
#region Creates Sample Data below.
DataTable CreateProvinceTable()
{
DataTable dt = new DataTable();
dt.Columns.Add( "ProvinceID ", typeof(int));
dt.Columns.Add( "ProvinceName ", typeof(string));
DataRow row = dt.NewRow();
row.ItemArray = new object[] {1, "Jiangsu "};
dt.Rows.Add(row);
row = dt.NewRow();
row[ "ProvinceID "] = 2;
row[ "ProvinceName "] = "Fujian ";
dt.Rows.Add(row);
row = dt.NewRow();
row[0] = 3;
row[1] = "Chongqing ";
dt.Rows.Add(row);
return dt;
}
DataTable CreateCityTable()
{
DataTable dt = new DataTable();
dt.Columns.Add( "CityID ", typeof(int));
dt.Columns.Add( "CityName ", typeof(string));
dt.Columns.Add( "ProvinceID ", typeof(int));
DataRow row = dt.NewRow();
row.ItemArray = new object[]{1, "Nanjiang ", 1};
dt.Rows.Add(row);
row = dt.NewRow();
row.ItemArray = new object[]{2, "Nanchong ", 1};
dt.Rows.Add(row);
row = dt.NewRow();
row.ItemArray = new object[] { 3, "Fuzhou ", 2 };
dt.Rows.Add(row);
row = dt.NewRow();
row.ItemArray = new object[] { 4, "Quanzhou ", 2 };
dt.Rows.Add(row);
row = dt.NewRow();
row.ItemArray = new object[] { 5, "Chongqing ", 3};
dt.Rows.Add(row);
return dt;
}
#endregion
</script>
<html xmlns= "http://www.w3.org/1999/xhtml " >
<head runat= "server ">
<title> ASP.NET Demo 1:DropDownList </title>
</head>
<body>
<form id= "form1 " runat= "server ">
<div>
Country: <asp:DropDownList ID= "drpCountry " runat= "server " AutoPostBack= "true " OnSelectedIndexChanged= "drpCountry_SelectedIndexChanged ">
<asp:ListItem Value= "cn "> Chinese </asp:ListItem>
<asp:ListItem Value= "uk "> U.K </asp:ListItem>
<asp:ListItem Value= "us "> U.S.A </asp:ListItem>
</asp:DropDownList>
Province: <asp:DropDownList ID= "drpProvince " DataTextField= "ProvinceName " DataValueField= "ProvinceId " AutoPostBack= "true " OnSelectedIndexChanged= "drpProvince_SelectedIndexChanged " runat= "server ">
</asp:DropDownList>
City: <asp:DropDownList ID= "drpCity " DataTextField= "CityName " DataValueField= "CityId " runat= "server " AutoPostBack= "true " OnSelectedIndexChanged= "drpCity_SelectedIndexChanged ">
</asp:DropDownList>
District: <asp:DropDownList ID= "drpDistrict " runat= "server "> </asp:DropDownList>
<br />
<span style= "color: #4371a6 "> 一、 <span style= "color: #000000 "> DropDownList无刷新实现四级联动 </span> <a
id= "viewpost1_TitleUrl " class= "postTitle2 " href= "http://www.cnblogs.com/Jinglecat/archive/2007/05/30/764570.html "> <span
style= "color: #4371a6 "> </span> </a> </span> <br />
目的:DropDownList实现四级联动分别展示三种如何给DropDownList添加数据源的方法,外加说明为什么你的DRP就是不会保持选择状态(应该在
IsPostBack
内绑定数据)。 </div>
</form>
</body>
</html>