千家信息网

ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程

发表于:2025-11-11 作者:千家信息网编辑
千家信息网最后更新 2025年11月11日,这篇文章主要介绍"ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程",在日常操作中,相信很多人在ASP.NET服务器
千家信息网最后更新 2025年11月11日ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程

这篇文章主要介绍"ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程",在日常操作中,相信很多人在ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答"ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程"的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

这三个控件都有一个Items集合,可以用 RepeatLayout 和 RepeatDirection 属性来控制列表的呈现形式。如果 RepeatLayout 的值为 Table,那么将在表中呈现列表。如果设置成 Flow,那么将在没有任何表结构的情况下呈现列表。默认情况下,RepeatDirection 的值为 Vertical。将此属性设置成 Horizontal 将会使列表水平呈现。

RadioButtonList:控件提供已选中一个选项的单项选择列表(数据源单选)。与其他列表控件相似,RadioButtonList 有一个 Items 集合,其成员与列表中的每个项目相对应。

DropDownList:下拉列表选择,对于有些形式的输入,用户必须从适用选项列表中选择一个选项(下拉唯一选择)。

CheckBoxList:多选列表,将数据源以横向或纵向方式呈现给用户,用户可以进行多个item的选择。

由于这三个控件是服务器端控件,需要在客户端进行解析,下面有三个控件的服务器端、客户端例子

服务器端

复制代码 代码如下:

runat="server">
单选一
单选二
单选三



runat="server">
多选一
多选二
多选三



runat="server">
下拉选择一
下拉选择二
下拉选择三

经过浏览器解析后

复制代码 代码如下:
















对于这三个控件的操作无非就是取值和赋值,下面通过Jquery和.cs两种方式进行操作

Jquery对三种控件进行操作

1、RadioButtonList

1)取值

复制代码 代码如下:

$("#RadioButtonList1").change(function () {
//弹出选中项的val值
alert($("input[name='RadioButtonList1']:checked").val());
//弹出选中项的text值
alert($("input[name='RadioButtonList1']:checked+label").text())
});

2)赋值

复制代码 代码如下:

//默认选中第二项
var rbts = document.getElementsByName("RadioButtonList1");
for (var i = 0; i < rbts.length; i++) {
if (rbts[i].value == "1")
rbts[i].checked = "true";
}

2、DropDownList

1)取值

复制代码 代码如下:

$("#DropDownList1").change(function () {
//弹出选中项的Val值
alert($("#DropDownList1").val());
//弹出选中项的text值
alert($("#DropDownList1 option:selected").text());
});

2)赋值

复制代码 代码如下:

//默认选中第二项
var ddls = $("#DropDownList1 option");
for (var i = 0; i < ddl.length; i++) {
if (ddl[i].value == "1") {
ddl[i].selected = "true";
}
}

3、CheckBoxList

1)取值

复制代码 代码如下:

$("#CheckBoxList1 > input").click(function () {
var arrval = [];
var val = "";
$("#CheckBoxList1 :checkbox:checked").each(function () {
//将选中项的值放进数组arrval
arrval.push($(this).val())
})
//将数组中的val值以','进行连接
val = arrval.join(',');
//弹出所有选择的项以,连接
alert(val);
var arrtext = [];
var text = "";
$("#CheckBoxList1 :checkbox:checked").each(function () {
//将选中项的text值放进arrtext数组中
arrtext.push($(this).next().html());
//将数组中的数据用,进行连接
text = arrtext.join(",");
})
//弹出选中项的Text值
alert(text);
});

2)赋值

复制代码 代码如下:

var cbks = $("#CheckBoxList1 input[type='checkbox']");
for (var i = 0; i < cbks.length; i++) {
if (cbks[i].value== "1"||cbks[i].value=="2") {
cbks[i].checked = "true";
}
}

到此,关于"ASP.NET服务器端如何控件RadioButtonList,DropDownList,CheckBoxList的取值、赋值用法教程"的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注网站,小编会继续努力为大家带来更多实用的文章!

0