-
解决Django中checkbox复选框的传值问题
2021-01-20 01:49:57Django 中，html 页面通过 form 标签来传递表单数据。...补充知识：解决checkbox复选框选中传值，不选中不传值的方案 解决checkbox复选框选中传值，不选中不传值的方案 问题描述： 一个form表单中的结 -
html实现多选框传值,解决Django中checkbox复选框的传值问题
2021-06-11 03:35:53对于复选框信息，即 checkbox 类型，点击 submit 后，数据将提交至 view 中的函数。我们通过request.POST.get() 函数来获取来自 html 页面的值，但是该函数只能 get 到选中的最后一个值。因此想要传递选中的多个值，...展开全文Django 中，html 页面通过 form 标签来传递表单数据。
对于复选框信息，即 checkbox 类型，点击 submit 后，数据将提交至 view 中的函数。
我们通过request.POST.get() 函数来获取来自 html 页面的值，但是该函数只能 get 到选中的最后一个值。
因此想要传递选中的多个值，需要用 request.POST.getlist() 函数
该函数返回一个列表，可通过迭代来获取列表中每一项的值。
补充知识：解决checkbox复选框选中传值，不选中不传值的方案
解决checkbox复选框选中传值，不选中不传值的方案
问题描述：
一个form表单中的结构是这样的：
则页面显示结果是：
如上填写数据，经过序列化后的数据是：
[
{"id":"1","infoType":"11","infoName":"名称1","fileIsOpen":"o"},
{"id":"2","infoType":"12","infoName":"名称2","fileIsOpen":"n"}
]
从数据中明显看书fileIsOpen字段的checkbox复选框选中则传值是"o"，未被选中则传值是"n"，其中这是错误的数据，因为被选中传的值是on，也就是说checkbox复选框选中传值，不选中不传值。那么怎么解决不选中也传值的问题呢？
解决方案：
我们可以设置隐藏域来代替checkbox复选框传递数据，具体的页面修改如下：
checkbox复选框对应的点击事件：
再次输入相同的数据传递的数据是：
[
{"id":"1","infoType":"11","infoName":"名称1","fileIsOpen":"0"},
{"id":"2","infoType":"22","infoName":"名称2","fileIsOpen":"1"}
]
从数据可以这次传递的数据是正确的
上述方案存在的问题
如果页面什么不传递，
则传递的数据是这样的：
[
{"fileIsOpen":"0"},
{"fileIsOpen":"0"}
]
因此后台在接受到数据后需要判断List集合中的对象的必选要素，如果不包含必传要素，就算传入上述数据也是不录入数据库的数据，则可以舍去这些数据。
以上这篇解决Django中checkbox复选框的传值问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。
时间： 2020-03-29
-
Django中checkbox复选框的传值问题
2018-08-03 16:38:19对于复选框信息，即 checkbox 类型，点击 submit 后，数据将提交至 view 中的函数。 我们通过 request.POST.get() 函数来获取来自 html 页面的值，但是该函数只能 get 到选中的最后一个值。 因此想要传递选中的多...展开全文Django 中，html 页面通过
form标签来传递表单数据。
对于复选框信息，即 checkbox 类型，点击 submit 后，数据将提交至 view 中的函数。我们通过
request.POST.get()函数来获取来自 html 页面的值，但是该函数只能 get 到选中的最后一个值。
因此想要传递选中的多个值，需要用request.POST.getlist()函数
该函数返回一个列表，可通过迭代来获取列表中每一项的值。
-
PHP（2）复选框表单传值
2020-11-15 11:07:39PHP（2）复选框表单传值 复选框：通常是将一类内容以同样（同名）的形式传递给后台，数据库储存通常是一个字符储存。选中才会提交，不选不会提交。 <!DOCTYPE html> <html> <head> <title&...展开全文PHP（2）复选框表单传值
复选框：通常是将一类内容以同样（同名）的形式传递给后台，数据库储存通常是一个字符储存。选中才会提交，不选不会提交。
<!DOCTYPE html> <html> <head> <title>"测试"</title> <meta charset="utf-8"> </head> <body> <form method="post" action="./index.php?"> <input type="checkbox" name="hobby" value="basketball"/>basketball <input type="checkbox" name="hobby" value="football"/>football <input type="checkbox" name="hobby" value="pingpang"/>pingpang <input type="submit" value="提交"/> </form> </body> </html><?php //接收数据 echo'<pre>'; var_dump($_GET);//get方式提交的数据 echo'<hr>'; var_dump($_POST);//post方式提交的数据 echo'<hr>'; var_dump($_REQUEST); ?>
我们选中了两个，后台却只提交了一个，是因为键值对中的关键值具有唯一性，两个选项的name属性相同，后面的会将前面的覆盖。
复选框的命名方式
1.在浏览器端，checkbox的name属性的值不论什么都会被浏览器毫无保留的提交
2.在PHP中$_POST、$_GET都会对同名的name属性进行覆盖。
解决方案
浏览器不认为[]（浏览器不认为有特殊性），但是PHP认为[]有特殊性，系统自动认为该符号时数组的形式，所以PHP就会自动的将同名的但是带有[]的元素组合到一起形成一个数组。<!DOCTYPE html> <html> <head> <title>"测试"</title> <meta charset="utf-8"> </head> <body> <form method="post" action="./index.php?"> <input type="checkbox" name="hobby[]" value="basketball"/>basketball <input type="checkbox" name="hobby[]" value="football"/>football <input type="checkbox" name="hobby[]" value="pingpang"/>pingpang <input type="submit" value="sub"/> </form> </body> </html><?php //接收checkbox数据 header('Content-type:text/html;charset=utf-8');//告诉浏览器当前服务器返回的内容是text/html,同时需要浏览器用utf-8字符集解析 echo'<hr>'; var_dump($_POST); ?>
PHP处理复选框数据
1、单选按钮的数据处理
Radio button：可以出现多个选项，但是只能选择其中一个
（1）表单中使用name属性，使用同名即可；只能选中一个。
（2）后台接收数据也不需要额外处理。
（3）数据库储存的话只需要一个字段储存普通数据即可（数字或者字符串）
（4）PHP拿到数据之后组织SQL直接储存到数据表即可。
2.多选框的数据处理
· （1）表单中name属性使用数组格式，名字[]（一类复选框数据使用一个）。
（2）后台接收到数据之后，是一个数组（数组不能储存到数据库）。
（3）PHP需要将数组转换成指定格式的字符串；使用分隔符分隔每一个元素并且形成字符串。
implode(数组,‘分隔符’)，将数组转化为字符串，元素之间分隔符分隔。
（4）PHP组织SQL直接存储到数据库。<?php //将复选框内容储存到数据库 //表示设计 /* id name gender hobby 1 mark 男 篮球，足球，乒乓球 */ header('Content-type:text/html;charset=utf-8'); $hobby=implode($_POST['hobby'],','); print_r($hobby); ?>
（5）如果是取出操作，那么取出数据之后使用explode字符串变成数组。
（6）在HTML显示中，通过判断复选框元素是否在数组中存在，来确定复选框checkbox是否有checked=“checkbox”属性；in_array()函数判断一个元素是否存在在一个数组中。
3、其他常规同名表单项的数据处理
（1）除开radio button 单选框和checkbox复选框，很少会出现同名的表单项。如果非要使用同名的来进行管理，那么可以采用checkbox方式进行操作。复选框细节
如果复选框没有选中，那么浏览器就不会提交，这样会引起错误，因此在PHP接收使用数据的时候，应该先判断是否存在该数据。
可以使用isset()函数判断不为空。<?php //将复选框内容储存到数据库 //表示设计 /* id name gender hobby 1 mark 男 篮球，足球，乒乓球 */ header('Content-type:text/html;charset=utf-8'); $hobby=isset($_POST['hobby'])?$_POST['hobby']:array(); $hobby_string=implode($hobby,','); echo $hobby_string; ?>
-
html 多选框 传值,jQuery+SpringMVC中的复选框选择与传值实例
2021-06-11 02:27:56一、checkbox选择在jQuery中，选中checkbox通用的两种方式：$("#cb1").attr("checked","checked");$("#cb1").attr("checked...2、当下面的复选框全部选中时，则将第一个复选框设置为选中，当下面的复选框中有一个没...展开全文一、checkbox选择
在jQuery中，选中checkbox通用的两种方式：
$("#cb1").attr("checked","checked");
$("#cb1").attr("checked",true);
对应的jQuery函数，主要完成三个功能：
1、第一个复选框选中或取消选中，则下面的复选框为全选或取消全选；
2、当下面的复选框全部选中时，则将第一个复选框设置为选中，当下面的复选框中有一个没有被选中时，则第一个复选框取消选中；
3、将下面的复选框的id值传递给Controller层，组成id数组，然后调用相应的方法(一般都是删除)。
$("input[name='id']").attr('checked',t.checked);//改变name名为id的input标签内的复选框的checked属性
}
function chg(){//当下面的复选框全部选中时，则将第一个复选框设置为选中，当下面的复选框中有一个没有被选中时，则第一个复选框取消选中；
var ids = $.makeArray($("input[name='id']"));
for(var i in ids){
if(ids[i].checked==false){//如果所有的复选框只要有一个未选中，则第一个复选框不会选中
$("input[name='ids']").attr('checked', false);
return;
}
}
$("input[name='ids']").attr('checked', true);//全部选中的情况下，则第一个复选框选中
}
function deleteBatch(){//将下面的复选框的id值传递给Controller层，组成id数组，拼接url到controller层，调用批量删除方法(deleteBatch())方法
var ids = $.makeArray($("input[name='id']:checked"));//通过$.makeArray将id放在数组中
var url = '<%basePath%>/web/goodsList/deleteBatch';//此url指向controller层的deleteBatch方法，需要id属性
var flag = true;
for(var i in ids){//遍历数组
if(i == 0){
url += "?id=" + ids[i].value;//第一个id属性前加？拼接
flag = false;
} else {
url += "&id=" + ids[i].value;//后面的id属性前加&拼接
flag = false;
}
}
if(flag){//如果没有选中商品
alert("请选中商品！");
return;
}
if(confirm("确定删除记录吗？")){
window.location.href = url;//把拼接好的id数组传给页面
}
}
二、在jsp页面中对应的列表：
1、列表中要给表头中的复选框(第一个复选框)设置name名，并调用chgAll(this)方法来实现全选或全不选；
2、table中的复选框设置name名，并调用chg()方法来实现上面的第二个功能；
3、form表单提交时调用deleteBatch()方法
//form表单提交时调用deleteBatch()方法//调用chgAll(this)方法来实现全选或全不选,此处的this指所有复选框对象商品编号商品标题
//调用chg()方法${webGoodsInfo.goodsNo}${webGoodsInfo.goodsTitle}三、看下spring MCV中的controller代码
@RequestMapping("deleteBatch")//对应jsp页面中的deleteBatch()请求
public String deleteBatch(Long[] id, RedirectAttributes redirectAttributes){//此处的id为页面中的id值，必须保持一直！！！！
if(id !=null&&id.length!=0){
goodsService.deleteBatch(id);
}
return "redirect:"+Global.getAdminPath()+"/web/webGoodsInfo/?repage";//重定向到列表页面
}
}
看下效果：
以上这篇jQuery+SpringMVC中的复选框选择与传值实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
-
基于layUI的下拉复选框，添加界面传值和修改页面取值
2019-09-06 16:03:57找到了这网站https://hnzzmsf.github.io/example/example_v4.html#select_value，里面介绍的很详细，我主要用到了多级联动，例子如下： 查看代码后得知，只要我返回为这个类型的json格式就能展示出以上效果。例子... -
html复选框不选中就不传值,input type="checkbox" 选中传值，不选中传值的方法讲解...
2021-06-11 16:45:15input type="checkbox" 选中传值，不选中传值的方法讲解 - html/css语言栏目：html.css - 红黑联盟 https://www.2cto.com/kf/201801/710664.html 原文：https://www.cnblogs.com/yaolei0422/p/12022573.html -
JS复选框向一个文本框中传值的多选效果
2015-05-20 17:10:00选择一个复选框，那么这个复选框的值就传到一个文本框中，如果这个文本框里有了就不用加了，没有则加。如果取消选择，则从文本框中取掉传的值。中间以“,”分隔，最后结尾没有“,”分隔符。 <!DOCTYPE html ... -
多个复选框向一个文本框内传值
2012-07-16 17:17:53> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> title>无标题文档title> style type="text/css"> input{ margin-right:3... -
天易02----多个复选框向一个文本框内传值
2012-07-04 11:24:00图片预览： ...DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="... -
Jquery实现父子类复选框，选择父类子类全选，选择子类父类显示中间状态，并传值到java后台
2017-05-24 13:57:30父子类复选框，选择父类子类全选，选择子类父类显示中间状态。先看一下图片效果是不是各位想要的，下面的方法我会从选择样式以及判断选择了那些值传入java后台，以及修改时的回显。包括html代码，css代码，js代码。 ... -
原生js打印阅览复选框不显示问题
2019-01-24 18:25:04原生js打印预览，主要是阅览时候回出现一些问题，比如复选框传值，√不显示，那么怎么来解决这个问题呢？首先我们看一下效果图：我的页面是vue环境 这是预览状态，√和元页面一致，已经传过来了，首先原生js... -
Angualar多选复选框逻辑处理
2019-10-29 17:10:38在html里引用多选框组件，并双向绑定数据 [nzIndeterminate] ：表示未全选状态时，全选按钮的状态变化 [(nzChecked)]：表示选中状态后的数据传值 <tr> <th nzShowCheckbox [(nzChecked)]="allChecked" ... -
表单传值
2019-05-17 19:28:00$_GET:接收以get方式提交的数据,get方式：可提交的数据量较小，在浏览器地址栏中可见，安全性较低 $_POST:接收以post方式...复选框：选项名称要设置为数组[] 转载于:https://www.cnblogs.com/tab15/p/10883250.html... -
HTML 不同frame之间传值
2017-11-07 13:42:00阅读目录 ...左右30%--70%，点击左边的复选框，右边显示相应的反应。 回到顶部 代码 main2.html <html> <frameset cols="30%, 70%"> <frame id="leftfrm" src="left2.html"> ... -
jsp表单传值后在页面中文显示乱码
2016-06-30 20:24:00主要通过添加以下代码来实现（前提是其他处的编码都设置成了utf-8）： response.setContentType("text/html;charset=utf-8");...index.jsp如下，使用复选框传值，传入姓名为中文时显示乱码：... -
easyui-combogrid选中给后台传值默认取idField:ID字段
2018-09-29 11:10:48//html <input id="addInfoType" class="easyui-combogrid" name="updateCode"... //easyui-combogrid 下拉框和复选框 用ajax请求后台将相应的数据赋值给变量有... -
【笔记】关于批量操作的取值和传值及全选反选
2017-04-25 19:55:21html的结构一般是这样的, 首先一个checkbox,代表全选, 全不选的复选框 全选 然后是每一行数据前的checkbox 数据1..... 数据2..... 数据3..... 然后会有一个隐藏域来存取到的要批量操作的所有数据的i -
php学习第三天
2019-03-19 22:45:111，复选框传值的方法 在php页面接收时候，hobby变成了一个数组，通过遍历数组就可以得到复选框传回来的值 php页面的编码问题可以使用下图方式来解决 header('Content-type:text/html;charset=utf-8'); 2... -
html+ajax实现批量删除
2019-07-04 20:59:49前段时间要用html+ajax做一个ssm框架的项目，遇到批量删除的问题，找了很多方法，都...获取选中的复选框的id； 将由id组成的字符串/数组传给controller；（之前传字符串数组会出现获取的值为[object,object]的问... -
Vue 基本语法-03
2019-08-02 21:48:38Vue 基本语法样式绑定事件处理器防止事件冒泡事件只能点击一次表单中的复选框表单中的下拉框组件局部Vue组件父组件传值给子组件子组件传值给父组件全局Vue组件 样式绑定 <!DOCTYPE html> <html> <... -
vue模板语法（下）
2019-08-02 18:08:04vue模板语法（下）样式绑定事件处理器防止事件冒泡事件只能点击一次表单中的复选框表单中的下拉框组件局部Vue组件父组件传值给子组件子组件传值给父组件全局Vue组件 样式绑定 <!DOCTYPE html> <html> &... -
前台遍历数组,后台foreach循环添加
2017-05-21 20:50:18前台实现将复选框的值保存到数组中,后台用list进行传值,mybatis中用foreach遍历循环添加或更新. 前台jsp代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> ... -
vue-split-table【表格合并和编辑插件】
2018-10-26 01:52:45vue-split-table应用的效果图 vue-split-table开源地址,...原生实现复选框的单选和全选功能;props属性像父组件暴露属性值;$emit自定义事件方法向父组件传值;作用域插槽由父向子传入html标签;嵌套input标签实现表格... -
2018mui教程 mui实战视频教程 web移动端开发教程+源码
2018-12-13 15:18:02MUI - 复选框、单选框、使用js获取选择值.mp4 MUI - cardview(卡片视图)、mask(遮罩蒙版).mp4 MUI - accordion(折叠面板)、button(按钮).mp4 h.js 使用教程.mp4 MUI - actionsheet(操作表)、badge(数字角标).mp4... -
C#编程经验技巧宝典
2008-06-01 08:59:3354 <br>0075 用回溯法找出n个自然数中取r个数的全排列 55 <br>0076 约瑟夫环问题 56 <br>0077 猴子选大王 57 <br>0078 如何判断IP是否正确 57 <br>0079 如何将小写金额转换为大写金额 57... -
ASP.NET 3.5 开发大全11-15
2012-02-12 17:53:105.6 复选框控件和复选组控件（CheckBox和CheckBoxList） 5.6.1 复选框控件（CheckBox） 5.6.2 复选组控件（CheckBoxList） 5.7 列表控件（DropDownList,ListBox和BulletedList） 5.7.1 DropDownList列表控件 5.7.2 ... -
ASP.NET 3.5 开发大全
2012-02-12 17:36:555.6 复选框控件和复选组控件（CheckBox和CheckBoxList） 5.6.1 复选框控件（CheckBox） 5.6.2 复选组控件（CheckBoxList） 5.7 列表控件（DropDownList,ListBox和BulletedList） 5.7.1 DropDownList列表控件 5.7.2 ...
