浅谈SpringMVC中post checkbox 多选框value的值(隐藏域方式)


Posted in Javascript onJanuary 08, 2018

我这里往后端传递checkbox 多选框value的值是通过字符串方式传递,先调用js对选定checkbox遍历获取选的的boxvalue,然后写进隐藏域,最后作文对象的属性提交。见代码:`

前端:

<form:form commandName="user" method="post">
     <c:forEach items="${deploys}" var="deploy" varStatus="deployStatus">
      <input type="checkbox" name="checkbox" value="${deploy.id}"/>${deploy.systemName}
      <br>
     </c:forEach>
     <spring:bind path="id">//实际存储的值,此处隐藏
      <div class="form-group" hidden>
       <form:input path="id" name="id" cssClass="form-control"></form:input>
      </div>
     </spring:bind>
     <spring:bind path="accessControl">//实际存储的值,此处隐藏
      <div class="form-group" hidden>
       <form:input path="accessControl" name="accessControl" cssClass="form-control"></form:input>
      </div>
     </spring:bind>
     <input type='button' value='确定' onclick="fun()"/>//调用脚本,给需要post的数据赋值
     <div class="form-group">
      <button type="submit" class="btn btn-primary">保存</button>
      <a class="btn btn-success pull-right" href="/user/list" rel="external nofollow" >返回</a>
     </div>
 </form:form>

脚本:

<script type="text/javascript">
 function fun() {
  var boxes = document.getElementsByTagName("input");
//  var val = []
  var str = "";
  for (var i = 0; i < boxes.length; i++) {
   if (boxes[i].name == "checkbox" && boxes[i].checked == true) {
//    val.push(boxes[i].value);
    str += boxes[i].value + ',';
   }
  }
  $("#accessControl").val(str)
//  alert(atr);
//  alert(val);
 }
</script>

后端:

@RequestMapping(value = "editaccesscontrol", method = RequestMethod.POST) //后端方法,
 public String editAccessControlPost(User user,ModelMap model ) {//接收参数对象user
  userMapper.updateUserAccessControl(user);
  model.addAttribute("user",user);
  model.addAttribute("success", "权限修改成功");
  return "redirect:/user/editaccesscontrol?id="+user.getId();
 }

以上这篇浅谈SpringMVC中post checkbox 多选框value的值(隐藏域方式)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
提高网站性能之 如何对待JavaScript
Oct 31 Javascript
jQeury淡入淡出需要注意的问题
Sep 08 Javascript
JSON语法五大要素图文介绍
Dec 04 Javascript
javascript时间自动刷新实现原理与步骤
Jan 06 Javascript
js购物车实现思路及代码(个人感觉不错)
Dec 23 Javascript
JQuery实现带排序功能的权限选择实例
May 18 Javascript
jQuery实现简单的点赞效果
May 29 Javascript
vue.js实现仿原生ios时间选择组件实例代码
Dec 21 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
jQuery事件绑定和解绑、事件冒泡与阻止事件冒泡及弹出应用示例
May 13 jQuery
详解nuxt 微信公众号支付遇到的问题与解决
Aug 26 Javascript
vue3.0实现点击切换验证码(组件)及校验
Nov 18 Vue.js
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 #jQuery
使用 Vue 绑定单个或多个 Class 名的实例代码
Jan 08 #Javascript
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 #jQuery
Angular 项目实现国际化的方法
Jan 08 #Javascript
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 #jQuery
简易Vue评论框架的实现(父组件的实现)
Jan 08 #Javascript
关于react-router/react-router-dom v4 history不能访问问题的解决
Jan 08 #Javascript
You might like
php数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
Laravel框架实现抢红包功能示例
2019/10/31 PHP
PHP实现一个按钮点击上传多个图片操作示例
2020/01/23 PHP
“不能执行已释放的Script代码”错误的原因及解决办法
2007/09/09 Javascript
jQuery 表格工具集
2010/04/25 Javascript
jquery中this的使用说明
2010/09/06 Javascript
javascript定时保存表单数据的代码
2011/03/17 Javascript
js防止表单重复提交实现代码
2012/09/05 Javascript
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果
2013/06/27 Javascript
jQuery is()函数用法3例
2014/05/06 Javascript
玩转方法:call和apply
2014/05/08 Javascript
基于angular中的重要指令详解($eval,$parse和$compile)
2016/10/21 Javascript
ReactJs实现树形结构的数据显示的组件的示例
2017/08/18 Javascript
详解vue mixins和extends的巧妙用法
2017/12/20 Javascript
详解如何在vue项目中引入elementUI组件
2018/02/11 Javascript
vue中v-cloak解决刷新或者加载出现闪烁问题(显示变量)
2018/04/20 Javascript
JavaScript常见JSON操作实例分析
2018/08/08 Javascript
微信小程序引入Vant组件库过程解析
2019/08/06 Javascript
js实现点赞按钮功能的实例代码
2020/03/06 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
2020/07/09 Javascript
在antd4.0中Form使用initialValue操作
2020/11/02 Javascript
Python常用的文件及文件路径、目录操作方法汇总介绍
2015/05/21 Python
python实现图片识别汽车功能
2018/11/30 Python
python把1变成01的步骤总结
2019/02/27 Python
Python3.6+Django2.0以上 xadmin站点的配置和使用教程图解
2019/06/04 Python
Pandas实现dataframe和np.array的相互转换
2019/11/30 Python
Python数据持久化存储实现方法分析
2019/12/21 Python
python 消除 futureWarning问题的解决
2019/12/25 Python
Python pip install如何修改默认下载路径
2020/04/29 Python
Python应用实现处理excel数据过程解析
2020/06/19 Python
python+flask编写一个简单的登录接口
2020/11/13 Python
Ray-Ban雷朋西班牙官网:全球领先的太阳眼镜品牌
2018/11/28 全球购物
环境卫生倡议书
2014/08/29 职场文书
横空出世观后感
2015/06/09 职场文书
Android基于Fresco实现圆角和圆形图片
2022/04/01 Java/Android
Tomcat配置访问日志和线程数
2022/05/06 Servers