DropDownList的一些知识

DropDownList 详解 下面向大家分享我在网站设计中用到 dropdownlist 的一些经验和网上看到的个人觉得对我 有所指点的代码 上传的附件为都自己所写 比较简单 但比较全 包括数据库 sqldatasource 与 dropdownlist gridview 的应用 DropDownList 详解 DropDownList 控件用于创建下拉列表 DropDownList 控件中的每个可选项都是由 ListItem 元素定义的 提示 该控件支持数据绑定 DropDownList 控件是一个下拉式的选单 功能和 RadioButtonList Web 控件很类似 提供 用户在一群选项中选择一个 不过 RadioButtonList Web 控件适合使用在较少量的选项群组 项目 而 DropDownList Web 控件则适合用来管理大量的选项群组项目 一 DropDownList 控件属性 1 AutoPostBack 属性 用于设置当改变选项内容时 是否自动回送到服务器 True 表示 回送 False 默认 表示不回送 2 DataSource 属性 用于指定填充列表控件的数据源 3 DataTextField 属性 用于指定 DataSource 中的一个字段 该字段的值对应于列表项的 Text 属性 4 DataValueField 属性 用于指定 DataSource 中的一个字段 该字段的值对应于列表项 的 Value 属性 5 Items 属性 表示列表中各个选项的集合 如 DropDownList Items i 表示第 i 个选项 i 从 0 开始 每个选项都有以下 3 个基本属性 Text 属性 表示每个选项的文本 Value 属性 表示每个选项的选项值 Selected 属性 表示该选项是否被选中 Count 属性 通过 Items Count 属性可获得 DropDownList 控件的选项数 Add 方法 通过 items Add 方法可以向 DropDownList 控件添加选项 Remove 方法 通过 items Remove 方法 可从 DropDownList 控件中删除指定的选项 Insert 方法 通过 items insert 方法 可将一个新的选项插入到 DropDownList 控件中 Clear 方法 通过 items clear 方法可以清空 DropDownList 控件中的选项 6 SelectedIndex 属性 用于获取下拉列表中选项的索引值 如果未选定任何项 则返回值 1 负 1 7 SelectedItem 属性 用于获取列表中的选定项 通过该属性可获得选定项的 Text 和 Value 属性值 8 SelectedValue 属性 用于获取下拉列表中选定项的值 9 SelectedIndexchanged 事件 当用户选择了下拉列表中的任意选项时 都将引发 SelectedIndexChanged 事件 二 使用语法 代码 ASP DropDownList Id 控件名称 Runat Server AutoPostBack True False DataSource DataTextField 数据源的字段 DataValueField 数据源的字段 OnSelectedIndexChanged 事件程序名称 一次性在同一个 table 绑定多个 DropDownlist 并且去掉重复项 即代替 distinct 从而提 高性能 收藏 代码 private void BindDropDownList DropDownList ddl2 DropDownList ddl3 DropDownList ddl4 DropDownList ddl5 string conn cs GetDsn SqlConnection cn new SqlConnection conn string strSqlDDL select Country CustName Substring CONVERT varchar 100 ActInstDate 101 1 2 ActInstDate ResellerName from tbcalicoinfo where surveystatus Completed DataSet ds new DataSet SqlDataAdapter da new SqlDataAdapter strSqlDDL cn cn Open da Fill ds tbcalicoinfo DataTable dt new DataTable ds Tables tbcalicoinfo DefaultView RowFilter country is not null RowFilter 过 滤 ds Tables tbcalicoinfo DefaultView Sort country asc Sort 排序 ddl2 DataSource ds Tables tbcalicoinfo DefaultView ToTable true country ToTable 去重复 ddl2 DataTextField country ddl2 DataBind ddl2 Items Insert 0 new ListItem All All ds Tables tbcalicoinfo DefaultView RowFilter ActInstDate is not null ds Tables tbcalicoinfo DefaultView Sort ActInstDate asc ddl3 DataSource ds Tables tbcalicoinfo DefaultView ToTable true ActInstDate ddl3 DataTextField ActInstDate ddl3 DataBind ddl3 Items Insert 0 new ListItem All All DataRow dr2 dt Select ResellerName is not null ResellerName asc ds Tables tbcalicoinfo DefaultView RowFilter ResellerName is not null ds Tables tbcalicoinfo DefaultView Sort ResellerName asc ddl4 DataSource ds Tables tbcalicoinfo DefaultView ToTable true ResellerName ddl4 DataTextField ResellerName ddl4 DataBind ddl4 Items Insert 0 new ListItem All All ds Tables tbcalicoinfo DefaultView RowFilter CustName is not null ds Tables tbcalicoinfo DefaultView Sort CustName asc ddl5 DataSource ds Tables tbcalicoinfo DefaultView ToTable true CustName ddl5 DataTextField CustName ddl5 DataBind ddl5 Items Insert 0 new ListItem All All cn Close 实现 DropDownList 无刷新二级联动 一 数据库设计 字段名 数据类型 说明 ClassID 自动编号 类编号 ClassName varchar 8 类名 UpClassID int 4 上级类编号 ClassLevel int 4 类级别 1 为大类 2 为小类 二涉及代码 1 首先 我们新建一个页面 DropTest aspx 在其中放入两个 DropDownList 控件 DropDownList1 和 DropDownList2 其完整代码如下 页面设计代码 代码 WebForm2 function load ClassID ClassID 为接收传递的大类编号 var drp2 document getElementById DropDownList2 function RemoveAll oElem 清除 DropDownList2 的所有项 var i 0 for i oElem length i 0 i oElem options remove i RemoveAll drp2 var oHttpReq new ActiveXObject MSXML2 XMLHTTP var oDoc new ActiveXObject MSXML2 DOMDocument oHttpReq open POST DropChild aspx ClassID ClassID false 调用读取小类数据的页 面 将大类 编号值传递过去 oHttpReq send result oHttpReq responseText oDoc loadXML result items1 oDoc selectNodes CLASSNAME Table ClassName 读取所有请求大类所属小类 的类名 items2 oDoc selectNodes CLASSNAME Table ClassID 读取所有请求大类所属小类的 编号 var itemsLength items1 length for i 0 i itemsLength i 将小类的类名和编号赋予 DropDownList2 var newOption document createElement OPTION newOption text items1 i text newOption value items2 i text drp2 options add newOption 该页面的后台文件 DropDownList1 aspx cs 中 Page Load 内的代码如下 代码 pageload 代码 if this IsPostBack SqlConnection con new SqlConnection server localhost database gswebDB uid sa pwd SqlDataAdapter da new SqlDataAdapter select ClassName ClassID from classname where ClassLevel 1 con DataSet ds new DataSet da Fill ds this DropDownList1 DataSource ds Tables 0 DefaultView this DropDownList1 DataTextField ClassName this DropDownList1 DataValueField ClassID this DropDownList1 DataBind this DropDownList1 Attributes Add onchange load this options this selectedIndex value 将 ClassID 作为参数传递给脚本函数 load ClassID 如果要传递的是 ClassName 应将 value 改为 innerText 但如果大类为中文 则调用小类时出现无法显示的问题 this DropDownList2 Attributes Add onChange javascript document Form1 TH value this opti ons this selectedIndex value 读取 DropDownList2 的值 将其赋给一个 TextBox 控件 TH 以获取 DropDownList2 的值 此页面实现如下功能 首先从数据库内读取所有类级别为 1 即大类 的类名和类编号 绑定到 DropDownList1 控件上 然后通过 DropDownList1 的 Attributes 属性调用 javascript 函数 load ClassID load 函数通过调用 DropChild aspx 页面 读取 XML 流 得到大类所 属小类的 ClassName 和 ClassID 2 新建 DropChild aspx 页面文件 其中不插入任何控件和文本 只在其后台文件 DropChild aspx cs 中的 Page Load 中加入以下代码 代码 if this Request ClassID null int state Convert ToInt32 this Request ClassID SqlConnection con new SqlConnection server localhost database gswebDB uid sa pwd SqlDataAdapter da new SqlDataAdapter select ClassName ClassID