3.3 选择类型控件
视频讲解
3.3.1 ListBox控件
1. ListBox控件概述
ListBox控件用于显示一组列表项，用户可以从中选择一项或多项。如果列表项的总数超出可以显示的项数，则ListBox控件会自动添加滚动条。如图3.21所示为ListBox控件。
图3.21 ListBox控件
1）ListBox控件的常用属性
ListBox控件的常用属性及说明如表3.14所示。
表3.14 ListBox控件的常用属性及说明
下面主要介绍ListBox控件的Items属性、SelectionMode属性和DataSource属性。
（1）Items属性
Items属性主要用来获取列表控件的集合，使用Items属性为ListBox控件添加列表项的方法有两种，下面分别进行介绍。
- ☑ 通过属性面板为ListBox控件添加列表项
首先，打开属性面板，单击Items属性后面的
按钮，会弹出一个如图3.22所示的“ListItem集合编辑器”对话框。
图3.22 “ListItem集合编辑器”对话框
在“ListItem集合编辑器”对话框中，用户可以通过单击“添加”按钮，为ListBox控件添加列表项，可以选中该列表项，在“属性”窗口面板中修改其属性值。当为ListBox控件添加完列表项后，还可以选中列表项，单击↑和↓按钮更改列表项的位置，单击“移除”按钮可以从列表项中将该项删除，如图3.23所示。
图3.23 添加列表项
最后，单击“确定”按钮，返回到页面中，在ListBox控件中将呈现已添加的列表项。
- ☑ 使用Items.Add方法为ListBox控件添加列表项
在后台代码中，可以编写如下代码，使用Items.Add方法为ListBox控件添加列表：
（2）SelectionMode属性
SelectionMode属性是ListBox列表控件的选择模式，该属性的设置选项有以下两种。
- ☑ 单选（Single）：用户只能在列表框中选中一项。
- ☑ 多选（MultiLine）：用户可以在列表框中选中多项。
（3）DataSource属性
通过使用DataSource属性可以从数组或集合中获取列表项并将其添加到控件中。当编程人员希望从数组或集合中填充控件时，可以使用此属性。例如，在后台，编写如下代码，将数组绑定到ListBox控件中：
注意
在使用ArrayList类数组之前，需要引用ArrayList类的命名空间，其引用代码为using System.Collections。
2）ListBox控件常用的方法
ListBox控件常用的方法是DataBind。当ListBox控件使用DataSource属性附加数据源时，使用DataBind方法将数据源绑定到ListBox控件上。
2. ListBox控件选项的多选和单选操作
【例3.9】ListBox控件选项的多选和单选操作。（示例位置：mr\TM\03\09）
下面的示例实现的主要功能是对ListBox控件中的列表项进行多选和单选操作。执行程序，示例运行结果如图3.24所示，在源列表框中选择部分选项，单击“<”按钮后，将把源列表框中选择的项移到目的列表框中，运行结果如图3.25所示。
图3.24 ListBox控件（选择前）
图3.25 ListBox控件（选择后）
程序实现的主要步骤如下。
新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加2个ListBox控件和4个Button按钮，其属性设置及其用途如表3.15所示。
表3.15 Default.aspx页面中控件的属性设置及用途
如果需要将源列表框中的选项全部移到目的列表框中，可以单击“<<”按钮。“<<”按钮的Click事件代码如下：
如果需要将源列表框中的部分选项移到目的列表框中，可以单击“<”按钮。“<”按钮的Click事件代码如下：
注意
（1）在列表框中，通过按Shift键或Ctrl键，可以进行多项选择。
（2）单击页面中的“<”按钮和“>”按钮，可以将选中的项目移动到指定的列表框中；单击页面中的“<<”按钮与“>>”按钮，所有项目都将移到指定的列表框中。
3. ListBox控件选项的上移和下移操作
【例3.10】ListBox控件选项的上移和下移操作。（示例位置：mr\TM\03\10）
下面的示例实现的主要功能是对ListBox控件中的列表选项进行上移和下移操作。执行程序，示例运行结果如图3.26所示，在列表框中选中“星期五”选项，单击“上移”按钮后，选中的选项将会向上移动，运行结果如图3.27所示。
图3.26 ListBox控件（上移前）
图3.27 ListBox控件（上移后）
程序实现的主要步骤如下。
新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加1个ListBox控件和4个Button按钮，其属性设置及其用途如表3.16所示。
表3.16 Default.aspx页面中控件的属性设置及用途
如果需要将列表框中选中的项上移，可以单击“上移”按钮。“上移”按钮的Click事件代码如下：
如果需要将列表框中选中的选项向下移动，可以单击“下移”按钮。“下移”按钮的Click事件代码如下：
3.3.2 DropDownList控件
1. DropDownList控件概述
DropDownList控件与ListBox控件的使用方法类似，但DropDownList控件只允许用户每次从列表中选择一项，而且只在框中显示选定选项。如图3.28所示为DropDownList控件。
（1）DropDownList控件的常用属性
DropDownList控件的常用属性及说明如表3.17所示。
图3.28 DropDownList控件
表3.17 DropDownList控件的常用属性及说明
说明
DropDownList控件的属性大部分与ListBox控件相同，这里不再赘述，读者可参见ListBox控件中的属性。
（2）DropDownList控件常用方法
DropDownList控件常用的方法是DataBind。当DropDownList控件使用DataSource属性附加数据源时，可使用DataBind方法将数据源绑定到DropDownList控件上。
（3）DropDownList控件常用事件
DropDownList控件常用的事件是SelectedIndexChanged。当DropDownList控件中的选定选项发生改变时，将触发SelectedIndexChanged事件。
2. 将数组绑定到DropDownList控件中
【例3.11】将数组绑定到DropDownList控件中。（示例位置：mr\TM\03\11）
下面的示例实现的主要功能是使用DropDownList控件的DataBind方法，将ArrayList数组绑定到DropDownList控件中。执行程序，示例运行结果如图3.29所示。
程序实现的主要步骤如下。
（1）新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加一个DropDownList控件。
（2）将页面切换到后台代码区，在使用ArrayList类之前，需要引用ArrayList类的命名空间，其代码如下：
（3）在页面的Page_Load事件中编写如下代码，将ArrayList数组绑定到DropDownList控件中。
3. 动态改变DropDownList控件的背景色
【例3.12】动态改变DropDownList控件的背景色。（示例位置：mr\TM\03\12）
下面的示例实现的主要功能是：当DropDownList控件列表项改变时，其背景色也做相应的改变。执行程序，示例运行结果如图3.30所示。
图3.29 DropDownList控件（上移前）
图3.30 动态改变DropDownList控件的背景色
程序实现的主要步骤如下。
新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加一个DropDownList控件，其属性设置如表3.18所示。
表3.18 DropDownList控件的属性设置
为了实现当选择的列表项发生改变时，DropDownList控件的背景色也做相应的改变，需要在DropDownList控件的SelectedIndexChanged事件下添加如下代码，在switch语句中改变DropDownList控件的背景色：
技巧
1. 获取DropDownList控件选项的索引号和标题的代码如下：
2. 向DropDownList控件的下拉列表框中添加列表项的代码如下：
3. 删除选择的DropDownList控件的列表项的代码如下：
4. 清除所有DropDownList控件的列表项的代码如下：
5. 获取DropDownList控件包含的列表项数的代码如下：
3.3.3 RadioButton控件
1. RadioButton控件概述
RadioButton控件是一种单选按钮控件，用户可以在页面中添加一组RadioButton控件，通过为所有的单选按钮分配相同的GroupName（组名），来强制执行从给出的所有选项集中仅选择一个选项。如图3.31所示为RadioButton控件。
（1）RadioButton控件的常用属性
RadioButton控件的常用属性及说明如表3.19所示。
图3.31 RadioButton控件
表3.19 RadioButton控件的常用属性及说明
下面介绍RadioButton控件的一些重要属性。
- ☑ Checked属性
如果RadioButton控件被选中，则RadioButton控件的Checked属性值为true，否则为false。
- ☑ GroupName属性
使用GroupName属性指定一组单选按钮，以创建一组互相排斥的控件。如果用户在页面中添加了一组RadioButton控件，可以将所有单选按钮的GroupName属性值设为同一个值，来强制执行在给出的所有选项集中仅有一个处于被选中状态。
- ☑ TextAlign属性
RadioButton控件可以通过Text属性指定要在控件中显示的文本。当RadioButton控件的TextAlign属性值为Left时，文本显示在单选按钮的左侧；当RadioButton控件的TextAlign属性值为Right时，文本显示在单选按钮的右侧。
（2）RadioButton控件常用的事件
RadioButton控件常用的事件是CheckedChanged，当RadioButton控件的选中状态发生改变时引发该事件。
2. 使用RadioButton控件模拟考试系统中的单选题
【例3.13】使用RadioButton控件模拟考试系统中的单选题。（示例位置：mr\TM\03\13）
下面的示例通过设置RadioButton控件的GroupName属性值，模拟考试系统中的单选题，并在RadioButton控件的CheckedChanged事件下，将用户选择的答案显示出来。执行程序并选择答案D，示例运行结果如图3.32所示，单击“提交”按钮，将弹出如图3.33所示的提示对话框。
图3.32 使用RadioButton控件模拟考试系统
图3.33 提示对话框
程序实现的主要步骤如下。
新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加1个Label控件、1个Button按钮控件和4个RadioButton控件，其属性设置及用途如表3.20所示。
表3.20 Default.aspx页面中控件的属性设置及用途
为了使用户将已选择的答案显示在界面上，可以在RadioButton控件的CheckedChanged事件中，使用Checked属性来判断该RadioButton控件是否已被选择，如果已被选择，则将其显示出来。单选按钮RadioButton1的CheckedChanged事件代码如下：
注意
单选按钮RadioButton2、RadioButton3和RadioButton4控件的CheckedChanged事件代码与RadioButton1控件的CheckedChanged事件代码相似，都是用来判断该单选按钮是否被选中。如果被选中，则将其显示出来。由于篇幅有限，其他单选按钮的CheckedChanged事件代码将不再给出，请读者参见本书资源包。
当用户已选择完答案，可以通过单击“提交”按钮获取正确答案。“提交”按钮的Click事件代码如下：
3.3.4 CheckBox控件
1. CheckBox控件概述
CheckBox控件是用来显示允许用户设置true或false条件的复选框。用户可以从一组CheckBox控件中选择一项或多项。如图3.34所示为CheckBox控件。
（1）CheckBox控件的常用属性
CheckBox控件的常用属性及说明如表3.21所示。
图3.34 CheckBox控件
表3.21 CheckBox控件的常用属性及说明
下面介绍CheckBox控件的一些重要属性。
- ☑ Checked属性
如果CheckBox控件被选中，则CheckBox控件的Checked属性值为true，否则为false。
- ☑ TextAlign属性
CheckBox控件可以通过Text属性指定要在控件中显示的文本。当CheckBox控件的TextAlign属性值为Left时，文本显示在单选按钮的左侧；当CheckBox控件的TextAlign属性值为Right时，文本显示在单选按钮的右侧。
（2）CheckBox控件的常用事件
CheckBox控件的常用事件是CheckedChanged，当CheckBox控件的选中状态发生改变时引发该事件。
2. 使用CheckBox控件模拟考试系统中的多选题
【例3.14】使用CheckBox控件模拟考试系统中的多选题。（示例位置：mr\TM\03\14）
下面的示例主要是模拟考试系统中的多选题功能，并在CheckBox控件的CheckedChanged事件下，将用户选择的答案显示出来。执行程序并选择答案A、B、C，示例运行结果如图3.35所示。单击“提交”按钮，将弹出如图3.36所示的提示对话框。
图3.35 使用CheckBox控件模拟考试系统
图3.36 提示对话框
程序实现的主要步骤如下。
新建一个网站，默认主页为Default.aspx，在Default.aspx页面上添加4个CheckBox控件、1个Button控件和4个Label控件，其属性设置及用途如表3.22所示。
表3.22 Default.aspx页面中控件属性设置及用途
注意
将CheckBox控件的AutoPostBack属性值设置为true，则当选中复选框时系统会自动将网页中的内容送回Web服务器，并触发CheckBox控件的CheckedChanged事件。
为了使用户将已选择的答案显示在界面上，可以在CheckBox控件的CheckedChanged事件中，使用Checked属性来判断该CheckBox控件是否已被选择，如果已被选择，则将其显示出来。复选框CheckBox1的CheckedChanged事件代码如下：
注意
复选框CheckBox2、CheckBox3和CheckBox4控件的CheckedChanged事件代码与CheckBox1控件的CheckedChanged事件代码相似，都是用来判断该复选框是否被选中。如果被选择，则将其显示出来。由于篇幅有限，其他复选框的CheckedChanged事件代码将不再给出，请读者参见本书资源包。
当用户已选择完答案，可以通过单击“提交”按钮获取正确答案。“提交”按钮的Click事件代码如下：
