在项目中有些地方需要批量添加的数据,在这里使用到checkbox比较方便一些。

例如:我需要将多个包添加到同一个地区的

主要的前端代码:

这个是用来放checkbox的。

  1. <div id="servicePacks"></div>

通过ajax来得到数据库的数据,循环写出checkbox把数据绑上去。

  1. function getAllServicePacks(){
  2. $.ajax({
  3. method: 'get',
  4. url: '路径',
  5. success: function (back) {
  6. if (back["stateCode"] === 200 && back.data && back.data.rows) {
  7. var rows = back.data.rows, len = rows.length, checkbox=$('#servicePacks');
  8. for (var i = 0; i < len; ++i) {
  9. checkbox.append($("<input type='checkbox' class='check_box' value='" + rows[i].id + "' name='jbbm' />&nbsp;&nbsp;<span>" +
  10. rows[i].servicePackName + "</span><br/><br/>"));
  11. }
  12. }
  13.  
  14. }
  15. })
  16. }

这里的得到选中的数据:

  1. var qx = $("input[name='jbbm']:checked").map(function () {
  2. return $(this).val();
  3. }).get().join(',');

在后台只需要用split分割就好了!

checkbox将选中的数据提交到后台的更多相关文章

  1. jsp多模块相同数据提交到后台之数据处理

    最近在写一个java多模块表单提交,起初想的只是一个简单的form表单提交,写的时候发现不是真简单.多个相同类型数据提交到后台接收的问题很困难. 于是,和人进行深入的讨论,感觉j以json的格式提交时 ...

  2. layui 数据表格+分页+搜索+checkbox+缓存选中项数据

    在做数据表格的时候遇到了很多坑, 今天整理一下方便以后使用. 主要功能是使用数据表格, 做分页,做搜索,  还有checkbox,  支持全选. 当选中一些数据的时候, 数据切换页面数据在切换回来后, ...

  3. jsp 页面json数据提交到后台spring处理举例

    0 前台: 'type'        : 'post', 'contentType' : 'application/json;charset=UTF-8', 'data'        : JSON ...

  4. from提交表单后 数据提交到后台 但不跳转页面 可用iframe

    可以页面事先加载被隐藏的iframe标签,或者等到需要的时候通过js生成,再提交,提交之前,form的target指向iframe(我是要实现新页面生成的时候程半透明状态,所以用了后者的方法) 代码如 ...

  5. bootstrap table checkbox获得选中得数据

    var idlist = $('#table').bootstrapTable('getAllSelections');     for (var i = 0; i < idlist.lengt ...

  6. jdbc工具类的封装,以及表单验证数据提交后台

    在之前已经写过了jdbc的工具类,不过最近学习了新的方法,所以在这里重新写一遍,为后面的javaEE做铺垫: 首先我们要了解javaEE项目中,文件构成,新建一个javaEE项目,在项目中,有一个we ...

  7. checkbox未选中不提交数据

    如果checkbox为选中的话提交的数据为NULL function checkForm() { alert(($("#checkbox").get(0).checked)); i ...

  8. angular的$http.post()提交数据到Java后台接收不到参数值问题的解决方法

    本文地址:http://www.cnblogs.com/jying/p/6733408.html   转载请注明出处: 写此文的背景:在工作学习使用angular的$http.post()提交数据时, ...

  9. javaWeb开发总结 ---- 前端数据插入到后台

    一,概述: 本文主要描述如何将数据通过表单提交到后台并插入到数据库.其中后台使用spring框架. 二,开发流程: 明确需求,即将什么数据插入到数据库 平台搭建,配置spring, 数据库,建表 走通 ...

随机推荐

  1. centos7 开机画面定制

    安装包 yum install plymouth-plugin-script 设置开机启动画面 mkdir /usr/share/plymouth/themes/tup 创建主题目录 cp /root ...

  2. Nginx执行php显示no input file specified的处理方法

    /var/www/nginx-default中放上一份phpinfo.php,使用http://localhost/phpinfo.info 访问,结果报错,显示 “No input file spe ...

  3. Leetcode: Sort Characters By Frequency

    Given a string, sort it in decreasing order based on the frequency of characters. Example 1: Input: ...

  4. android实现通过浏览器点击链接打开本地应用(APP)并拿到浏览器传递的数据

    为了实现这个功能可折腾了我好久,先上一份代码,经楼主验证是绝对可以用的而且也比较清晰的代码!(ps:还是先剧透下吧,第三方大部分浏览器无法成功.) 点击浏览器中的URL链接,启动特定的App. 首先做 ...

  5. 匹配所有不可见元素,或者type为hidden的元素

    查找隐藏的 tr HTML 代码: <table> <tr style="display:none"><td>Value 1</td> ...

  6. 随机获取数据库中的某一条数据(基于yii2框架开发)

    注意: 使用PHP函数array_rand()得到的是这个数组中的那个值相对应的下标键值,需要配合原来的数组进行,例如: $rand_keys = array_rand($ids,1); $id = ...

  7. C#网络爬虫

    CronMaker is a utility which helps you to build cron expressions. CronMaker uses Quartz open source ...

  8. [linux系统]--Sed

    删除:d命令 $ sed ‘2d’ example—–删除example文件的第二行. $ sed ‘2,$d’ example—–删除example文件的第二行到末尾所有行. $ sed ‘$d’ ...

  9. android界面横屏和竖屏的切换

    关于android横屏和竖屏的切换网上给了很多种.但是有些介绍的方法都是在android旧版本上. 我现在把握用到的情况写下来用于备忘: android 版本:4.0 - 4.4 要求:android ...

  10. App.xaml

    <Application x:Class="HelloWorld.App" xmlns="http://schemas.microsoft.com/winfx/20 ...