多选框使用记录
程序员文章站
2022-03-07 14:26:06
...
项目中需要添加多选框选择功能,遇到一下困难,记录一下
1、传递多选框的值给后台
虽然Java后台可以通过
request.getParameterValues()
获取多选框的值,但是该方法返回的是一个字符串数组,而我在项目中并不想获取字符串数组,只想要字符串。此时可以使用以下js代码实现
var channel = "";
$('input:checkbox:checked').each(function (index, item) {
channel+=$(this).val()+",";
});
channel = channel.substr(0,channel.length-1);
2、从数据库中获取数据为多选框进行赋值
对某一条数据进行编辑时,获取数据并赋值时在多选框方面需要进行特殊处理。js代码如下:
var channels= new Array();
channels=data1[0].channel.split(",");
var $input=$("input[name='channel']");
for (var i = 0; i < channels.length; i++) {
for (var j = 0; j < $input.length; j++) {
var inputVal=$input.eq(j).val();
if (inputVal==channels[i]) {
$input.eq(j).attr('checked',true);//让其为选中
}
}
}
3、全选全不选功能
需要一个点击事件进行触发全选全不选功能
function choose(){
var ch=$("input[name='channel']");
if($("#allChannel")[0].checked==true){
for(var i=0;i<ch.length;i++){
ch[i].checked=true;
}
}else{
for(var i=0;i<ch.length;i++){
ch[i].checked=false;
}
}
}
上一篇: 多选框的使用
下一篇: JQuery根据json数据选中多选框
推荐阅读
-
在ASP.NET 2.0中操作数据之三十一:使用DataList来一行显示多条记录
-
多列复合索引的使用 绕过微软sql server的一个缺陷
-
Win7怎么隐藏使用记录?Win7隐藏最近使用记录的方法
-
IETester 网站在多IE版本兼容性测试工具使用方法
-
iOS使用pageViewController实现多视图滑动切换
-
Android使用 Retrofit 2.X 上传多文件和多表单示例
-
使用vuex解决刷新页面state数据消失的问题记录
-
Android RadioButton单选框的使用方法
-
Android控件ToggleButton多状态按钮使用详解
-
使用Spring Data JPA的坑点记录总结