AD

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

这篇文章主要介绍了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绑定数据表实现两级联动示例

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动态绑定数据表,实现了根据选择的省份动态下拉该省份下的城市的功能,达到了面向对象设计中解耦的目的,增强了代码的可维护性和用户的体验度。

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

标签: dropdownlist, 两级联动, 绑定数据表
分类: 实用技巧
时间: 2014-03-19

相关文章

  1. jQuery 中国省市两级联动选择附图

    有关中国省市两级联动选择的实现代码在网上可以找到很多,而本文要为大家介绍的是一个比较实用的省市两级联动选择,感兴趣的朋友可以参考下 <!DOCTYPE html PUBLIC "-//W3C//DTD X ...
  2. asp.net两级联动(包含添加和修改)

    两级联动实现代码 <script language="javascript" type="text/javascript"> //科目数据初始化 var subcat ...
  3. 两级联动select刷新后其值保持不变的实现方法

    两级联动select刷新后,select值保持不变即点击提交按钮后,页面select中继续维持提交前的值,下面有个不错的示例,大家可以参考下 背景 还是学院和专业的关系,我需要保持点击提交按钮后,页面select中继续维 ...
  4. asp.net datalist绑定数据后可以上移下移实现示例

    这篇文章主要介绍了asp.net datalist绑定数据后可以上移下移的示例代码,需要的朋友可以参考下 if (e.CommandName == "Up") { int index = e.Item ...
  5. (asp.net c#)DropDownList绑定后显示对应的项的两种方法

    (asp.net c#)DropDownList绑定后显示对应的项的两种方法 其实两个方法的思路都是一样,都是拿id去配对 方法一: 实现代码 DropDownList1.DataSource = listSort; D ...
  6. C语言顺序表实现代码排错

    这篇文章主要介绍了C语言顺序表实现方法,大家参考使用吧 今天本来想写段代码练练手,想法挺好结果,栽了个大跟头,在这个错误上徘徊了4个小时才解决,现在分享出来,给大家提个醒,先贴上代码: /**************** ...
  7. python单链表实现代码实例

    这篇文章主要介绍了python单链表实现代码,大家参考使用吧 链表的定义:链表(linked list)是由一组被称为结点的数据元素组成的数据结构,每个结点都包含结点本身的信息和指向下一个结点的地址.由于每个结点都包含了 ...
  8. 落伍首发 php+mysql 采用ajax技术的 省 市 地 3级联动无刷新菜单 源码

    绝对原创 测试地址: http://www.mlmm.cn/mypage/?name=ceshi 测试页代码: <html> <head> <meta http-equiv="Co ...
  9. MySQL分表实现上百万上千万记录分布存储的批量查询设计模式详解

    本篇文章是对使用MySQL分表实现上百万上千万记录分布存储的批量查询设计模式进行了详细的分析介绍,需要的朋友参考下 我们知道可以将一个海量记录的 MySQL 大表根据主键.时间字段,条件字段等分成若干个表甚至保存在若干服 ...
  10. 可视化Swing中JTable控件绑定SQL数据源的两种方法深入解析

    以下是对可视化Swing中JTable控件绑定SQL数据源的两种方法进行了详细的分析介绍,需要的朋友可以过来参考一下 在 MyEclipse 的可视化 Swing 中,有 JTable 控件. JTable 用来显示和编 ...
  11. ListView的Adapter使用(绑定数据) 之 自定义每一项的布局去绑定数据

    之前写的绑定数据是只是简单的绑定了字符串,这次我们将一次绑定多条数据并且尝试用自定义的布局.在这篇文章中首先讲解的是用Hashmap 去绑定数据,第二个例子,讲解自定义布局然后绑定数据 大家先看第一个例子显示: 这个界面 ...
  12. 数据库的三级模式和两级映射介绍

    在这里大家一定要注意三级模式中的概念模式对应的是数据库设计的逻辑模型,而不是概念模型(E-R模型),一定不要弄混了 数据库的三级模式和两级映射 数据库的三级模式两级映射如下图所示 三级模式 外模式:应用程序用到的部分数据 ...
  13. .net控件dropdownlist动态绑定数据具体过程分解

    一.在页面初始化时候将集合绑定到DropDownList:二.在页面初始化的时候向DropDownList添加数据:三.将DataReader读取的数据动态绑定到DropDownList等等 一.在页面初始化时候将集合绑 ...
  14. ASP.NET中的DataGridView绑定数据和选中行删除功能具体实例

    废话就不多说了,都说.NET是托控件的,我就托给你们看,这个博文主要讲 DataGridView 的数据绑定,和选中行删除功能 首现我们拖入一个DataGridView控件到.aspx页面中,然后绑定你需要显示的列,具体 ...
  15. ThinkPHP使用心得分享-ThinkPHP + Ajax 实现2级联动下拉菜单

    联动菜单的数据存在数据库,可以随时通过对数据库添加删除修改改变菜单数据,而不需修改代码,同时,实现了2级后,也可以实现3级,4级...等关联菜单 首先是数据库的设计.分类表叫cate. 我做的是分类数据的二级联动,数据需 ...
  16. ThinkPHP + Ajax 实现2级联动下拉菜单

    首先是数据库的设计.分类表叫cate. 我做的是分类数据的二级联动,数据需要的字段有:id,name(中文名),pid(父id). 父id的设置: 若数据没有上一级,则父id为0,若有上级,则父id为上一级的id. 数据 ...
  17. dataGrid 多维表头.表头跨行跨列设计及绑定数据

    dataGrid 其实就是一个html table,本文将介绍dataGrid 多维表头,表头跨行跨列设计方法需要了解的朋友可以参考下 dataGrid 其实就是一个html table 想清楚这个以后,要设置多维表头就 ...
  18. Java两级缓存框架 J2Cache

    J2Cache 网站 : http://git.oschina.net/ld/J2Cache J2Cache 是 OSChina 目前正在使用的两级缓存框架.第一级缓存使用 Ehcache,第二级缓存使用 Redis . ...
  19. jquery 可排列的表实现代码

    jquery 可排列的表实现代码 在Table标签上设置 class="sortable" 且Table要设置ID. 在Table标签上设置 class="sortable" 且T ...