DropDownList绑定数据表实现两级联动示例

更新时间：2014年03月11日 15:37:12 作者：

这篇文章主要介绍了DropDownList绑定数据表实现两级联动具体实现,需要的朋友可以参考下

场景一：平时我们在DropDownList控件下添加下拉选项时，都会使用它的Item.Add方法，直接在代码下添加。如果我们想添加或修改下拉选项，则必须去修改源代码。如果几个DropDownList控件的下拉选项相同，我们则需要重复添加好多次，后期的维护工作很不方便。

场景二：我们在12306网站买票时，肯定遇到过这么一种情景：我们需要先选定目的地的省份，选完省份后在城市选框中会自动加载该省份的城市，实现两级联动。

针对以上两个场景，我们可以用DropDownList直接绑定数据表，根据选择的省份动态加载该省份下的城市。光说不练，不是好汉，让我用一个小Demo来大家演示下详细过程吧。

首先我们需要在数据库中建立两个表，一个是Province（省份）表，一个是City（城市）表。建表语句如下：

复制代码代码如下:

 
Create Table Province 
( 
ProID int primary key, 
ProName varchar(20) not null 
) 

Create Table City 
( 
CityID int primary key, 
ProID int foreign key references Province(ProID), 
CityName varchar(20) 
) 

Insert into Province values('1','北京') 
Insert into Province values('2','河北') 
Insert into Province values('3','山东') 

insert into City values('1','1','海淀') 
insert into City values('2','1','丰台') 
insert into City values('3','1','大兴') 
insert into City values('4','2','衡水') 
insert into City values('5','2','廊坊') 
insert into City values('6','2','保定') 
insert into City values('7','3','济南') 
insert into City values('8','3','烟台') 
insert into City values('9','3','青岛') 

通过建表语句我们可以知道，北京下有三个城市--海淀、丰台、大兴，河北下有三个城市--衡水、廊坊、保定，山东有三个城市--济南、烟台、青岛。

然后我们在Web窗体中放好控件，效果如下图所示：

dropDownList控件名称分别为ddlProvince、ddlCity

接着我们在Web后台代码中实现功能。我们需要在Web窗体加载时，ddlProvince控件绑定Province表，在ddlProvince下拉选项改变时，ddlCity控件绑定City表。实现代码如下：

建立数据库连接类：

复制代码代码如下:

 
public class DB 
{ 
//连接数据库的字符串 
public static SqlConnection CreateConnection() 
{ 
SqlConnection con = new SqlConnection("Data Source=. ;Initial Catalog=test;uid=sa;pwd=123456;"); 
return con; 
} 
} 

Web窗体加载时执行代码：

复制代码代码如下:

 
protected void Page_Load(object sender, EventArgs e) 
{ 
//如果窗体是第一次加载 
if (!this.IsPostBack) 
{ 
//绑定省份 
SqlConnection con = DB.CreateConnection(); 
//打开数据库连接 
con.Open(); 
SqlCommand cmdProvince = new SqlCommand("select * from Province", con); 
SqlDataReader sdrProvince = cmdProvince.ExecuteReader(); 
//将sdrProvince中的内容绑定到ddlProvince下拉列表中 
this.ddlProvince.DataSource = sdrProvince; 
//需要显示的数据表Province中的内容 
this.ddlProvince.DataTextField = "ProName"; 
//需要显示的数据表Province中的主键 
this.ddlProvince.DataValueField = "ProID"; 
this.ddlProvince.DataBind(); 
sdrProvince.Close(); 
//关闭数据库连接 
con.Close(); 
} 
} 

ddlProvince控件下拉选项改变时执行的代码：

复制代码代码如下:

 
protected void ddlProvince_SelectedIndexChanged(object sender, EventArgs e) 
{ 
SqlConnection con = DB.CreateConnection(); 
//打开数据库连接 
con.Open(); 
//绑定城市 
SqlCommand cmdCity = new SqlCommand("select * from City where ProID=" + this.ddlProvince.SelectedValue, con); 
SqlDataReader sdrCity = cmdCity.ExecuteReader(); 
//将sdrCity中的内容绑定到ddlCity下拉列表中 
this.ddlCity.DataSource = sdrCity; 
//需要显示的数据表City中的内容 
this.ddlCity.DataTextField = "CityName"; 
//需要显示的数据表City中的主键 
this.ddlCity.DataValueField = "CityID"; 
this.ddlCity.DataBind(); 
sdrCity.Close(); 
//关闭数据库连接 
con.Close(); 
} 

这样，我们就用DropDownList动态绑定数据表，实现了根据选择的省份动态下拉该省份下的城市的功能，达到了面向对象设计中解耦的目的，增强了代码的可维护性和用户的体验度。

希望我的讲解能对大家有所帮助。

您可能感兴趣的文章:

C# new和override的区别分析
C# new和override都会覆盖父类中的方法。那它们两者之前有什么区别呢？
2013-03-03
asp.net获取网站绝对路径示例
在编写 ASP.NET 应用程序的时候，有时为了更好地进行控制静态文件的路径，如在模板页或者用户控件中设置js或者css文件的路径等，采用绝对路径是难免的。下面就是几种获取绝对路径的几种方法
2014-02-02
ASP.NET Core中如何实现重定向详解
这篇文章主要给大家介绍了关于ASP.NET Core中如何实现重定向的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021-01-01
asp.net下按钮点击后禁用的实现代码
有时候为了不让用户连续的点击某按钮，我们会选择将其在点击后禁用。
2010-09-09
ASP.NET MVC 从IHttp到页面输出的实例代码
MVCHandler应该算是MVC真正开始的地方。MVCHandler实现了IHttpHandler接口，ProcessRequest便是方法入口
2013-09-09
Asp.Net类型转换类(通用类)代码分享
本文给大家分享两段代码，一段代码关于asp.net类型转换通用类的代码，第二段关于asp.net 页面数据验证通用类的实例代码,代码简单易懂，非常不错，感兴趣的朋友参考下吧
2016-01-01
安装 VS2005 SP1 有关问题的解决办法
安装 VS2005 SP1 有关问题的解决办法...
2007-04-04
ASP.NET创建动态缩略图的方法
这篇文章主要介绍了ASP.NET创建动态缩略图的方法,实例分析了asp.net动态操作图片的相关技巧,需要的朋友可以参考下
2015-06-06
ASP.NET MVC传送参数至服务端详解及实例
这篇文章主要介绍了ASP.NET MVC传送参数至服务端详解及实例的相关资料,需要的朋友可以参考下
2016-11-11
ASP.NET MVC的四种验证编程方式
ASP.NET MVC采用Model绑定为目标Action生成了相应的参数列表，但是在真正执行目标Action方法之前，还需要对绑定的参数实施验证以确保其有效性，我们将针对参数的验证成为Model绑定，需要的朋友可以参考下
2015-10-10