checkbox选择根据后台List数据进行回显
需求:记住用户已经选择的 checkbox 选项,当用户再次对该 checkbox 进行选择操作时,应对该用户已经选择的 checkbox 选项进行选中操作。
示例代码:
- checkbox,js遍历后台list
- $("#merchantSubclass").show();
- var j = 0;
- var merchantCategoryList = "${merchantCategoryList}";
- var merchantCategoryListTh = "${fn:length(merchantCategoryList)}";
- var array = new Array();
- <c:forEach items="${merchantCategoryList}" var="item">
- array.push("${item}");
- </c:forEach>
- for (var i = 0; i < data.length; i++) {
- var checked="";
- for(var k=0;k<array.length;k++){
- if(data[i].id==array[k]) {
- checked="checked='checked'";
- }
- }
- $("#merchantTypeSubclass").append("<div class='merchantTxt' style='width:140px;float: left;'>"+
- "<input type='checkbox' name='merchantTypes' value='"+data[i].id+"' "
- +checked+" class='merchantTypes'>"+
- data[i].typeName+" </div>");
- j++;
- if(j==5){
- $("#merchantTypeSubclass").append("<span class='merchantTxt'><br/></span>");
- j=0;
- }
- }
图解:
难点:js 中无法遍历 List 集合,所以只能先把数组转换到 Array 数组,再进行循环遍历。
js 遍历 List 会有这样的问题:
- <script type="text/javascript" language="javascript">
- <!--
- //后台servlet中已经向request中set了一个List集合对象,名为mulst
- //在js中使用fn标签和EL表达式获得mulst List集合对象的长度
- var mulength = '${fn:length(mulst)}';
- //遍历节点数组
- for(var i = 0;i<mulength;i++)
- {
- alert('${mulst[i]}');//在这发生了问题,我想在js中要循环取出List中的集合中的数据,但是这样取不出来
- //如果使用alert('${mulst[0]}');//这样可以获得List中第一条数据.
- }
- //-->
- </script>
- <script>
- <c:forEach var="obj" items="${mulst} ">
- alert("${obj.属性}");
- </c:forEach>
- </script>
参考文章:
http://blog.csdn.net/XiaoKanZheShiJie/article/details/47280449
http://www.cnblogs.com/libingql/archive/2011/11/07/2238663.html
checkbox选择根据后台List数据进行回显的更多相关文章
- bootstrap selectpicker控件select下拉框动态数据无法回显的问题
有关于selectpicker下拉框数据回显的问题,当查看一个对象的属性的时候, 发现有关于selectpicker的下拉框并没有将返回的数据进行回显,显示的都是请选择, 经查证,当查看属性的时候,他 ...
- 捅伊朗黑客PP — 后台登陆POST+错误回显 注入
看了一个泰国政府的网站被伊朗的黑客挂页,上面写着“Your Box 0wn3z By Behrooz_Ice – Q7x -Sha2ow -Virangar -Ali_Eagle -iman_takt ...
- thymeleaf下拉框从后台动态获取集合数据并回显选中
今天遇到从后台集合中取出对象在前台页面下拉列表展示: <select name="signature" lay-search="" class=" ...
- bootstrap fileinput控件 + django后台上传、回显简单使用
一.控件下载:https://github.com/kartik-v/bootstrap-fileinput/ 官网:http://plugins.krajee.com/file-input 需要引入 ...
- jquery接收后台数组或集合回显复选框
公司使用的框架比较旧,没有使用el等表达式.如果后台传递的是数组,需要把数组转为以逗号分隔的字符串. <% String context = request.getContextPath(); ...
- sqlldr导入数据取消回显记录条数
之前在脚本中使用sqlldr导入数据时,如果表的数据量较大的话,会使日志文件变得极大,之后在网上查找了很久,才在一个偶然的机会找到这个参数 silent=all 但是最近发现这样写有个问题,就是加了这 ...
- SpringBoot集成tk mybatis插入数据,回显主键为null
实体信息如下 @Data public class ApiCertificate{ @Id @GeneratedValue(generator = "JDBC") private ...
- vue + element-ui Table的数据多选,多页选择数据回显,分页记录保存选中的数据。
业务的需要:我要对与会人员勾选,记录所选的与会人员,并且点击到别的页面上时也要记录所勾选的.第一次尝试,每次点击下一页数据都会清空.然后我就去element ui官网查看了api.实现如下: 在tab ...
- checkbox数据回显问题
一.问题 在用复选框的时候,最常用的无非就是全选,全不选,数据回显等问题!要做的比较灵活!最近做项目的时候,就遇到这些问题,下面从js和JQueyr两方面解决一下全选,全不选,数据回显的问题. 二.H ...
随机推荐
- 王者荣耀交流协会 — Alpha阶段中间产物
1. 版本控制 Coding :https://git.coding.net/SuperCodingChao/PSPDaily.git 2. 软件功能说明书 软件功能说明书发布在小组成员袁玥同学的博客 ...
- "助成"招聘网站视频简介
我们小组为我们的作品录制了一个一分多钟的电梯介绍视频,这是视频连接,我上传到了优酷上:http://v.youku.com/v_show/id_XMzIzMTc1ODc2NA==.html?spm=a ...
- KMP---POJ 3461 Oulipo
Description The French author Georges Perec (1936–1982) once wrote a book, La disparition, without t ...
- 周总结<4>
经过了一周的学习,我们在html以及C语言方面又有的新的知识点的学习. html 自习表格,函数等 C语言 哈弗曼编码 Html案例: 一. <!DOCTYPE html PUBLIC &quo ...
- (二)MySQL中级篇
1.视图view 视图是一个虚拟表,其内容由查询定义.定义视图的筛选可以来自当前或其它数据库的一个或多个表,或者其它视图. 视图的优点: ①简化了操作,把经常使用的数据定义为视图. ②安全性,用户只能 ...
- git向github提交时不输入账号密码
缘由:每次向github提交代码时都要输入用户名密码,太麻烦了,影响效率 解决方案: 方案一: 在你的用户目录下新建一个文本文件.git-credentials Windows:C:/Users/us ...
- Ubuntu 下升级 php
起因: 在现有的 Apache + PHP 环境下,增加一个 PHP Extension 扩展时,遇到错误: Unable to initialize moduleModule compiled wi ...
- Destoon 模板存放规则 及 语法参考
模板存放规则及语法参考 一.模板存放及调用规则 模板存放于系统 template 目录,template 目录下的一个目录例如 template/default/ 即为一套模板 模板文件以 .htm ...
- php opensll加解密类
<?php $pri = "-----BEGIN RSA PRIVATE KEY----- MIICXQIBAAKBgQCzJc4RrAqaH2Es02XQ91Cqp/JK0yX893 ...
- ViewPager、Fragment、Matrix综合使用实现Tab滑页效果
原文地址:http://www.cnblogs.com/kross/p/3372987.html 我们实现一个上面是一个可以左右滑动的页面,下面是三个可点击切换的tab按钮,tab按钮上还有一个激活条 ...