解决layui checkbox 提交多个值的问题


Posted in Javascript onSeptember 02, 2019

吐槽一下,layui的checkbox简直就是一个坑...(不能提交数组)

数据是从后台来的

<div class="layui-form-item" >
   <label class="layui-form-label">品种</label>
   <div class="layui-input-inline">
     {foreach $quotation_type as $key=>$val}
        <input name="quotation_type" lay-skin="primary" value="{$key}" title="{$val}" type="checkbox">
     {/foreach}
   </div>
</div>

看看JS部分,有点绕,先把数据写进数组,然后,数组转成json格式,覆盖掉原先的data.field里面的数据

//获取checkbox数据
quotation = new Array();
$("input:checkbox[name='quotation_type']:checked").each(function(){
   quotation.push($(this).val());
});
var json = {};
for (var i = 0; i < quotation.length; i++) {
   json[i] = quotation[i];
}
let myJson = JSON.stringify(json);
data.field.quotation_type = myJson ;

PHP部分,只需要把提交过来的json字符串转成数组就可以使用了

//提交的checkbox  提交过来的是json字符串
$data['quotation_type'] = json_decode($request->post('quotation_type'),true);

最后,进行你需要的数据库操作就可以了。

以上这篇解决layui checkbox 提交多个值的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网站上面有这种切换效果
Jun 26 Javascript
图标线性回归斜着移动到指定的位置
Aug 16 Javascript
JavaScript网页定位详解
Jan 13 Javascript
javascript学习笔记(六)数据类型和JSON格式
Oct 08 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
Jan 13 Javascript
javascript面向对象之this关键词用法分析
Jan 13 Javascript
JavaScript更改字符串的大小写
May 07 Javascript
jQuery+AJAX实现无刷新下拉加载更多
Jul 03 Javascript
真正好用的js验证上传文件大小的简单方法
Oct 27 Javascript
javascript 判断一个对象为数组的方法
May 03 Javascript
Angular 4环境准备与Angular cli创建项目详解
May 27 Javascript
详解如何在nuxt中添加proxyTable代理
Aug 10 Javascript
LayUI动态设置checkbox不显示的解决方法
Sep 02 #Javascript
layui checkbox默认选中,获取选中值,清空所有选中项的例子
Sep 02 #Javascript
layui 选择列表,打勾,点击确定返回数据的例子
Sep 02 #Javascript
利用JS响应式修改vue实现页面的input值
Sep 02 #Javascript
layui 弹出层回调获取弹出层数据的例子
Sep 02 #Javascript
vue中通过使用$attrs实现组件之间的数据传递功能
Sep 01 #Javascript
Vue使用mixin分发组件的可复用功能
Sep 01 #Javascript
You might like
深入PHP运行环境配置的详解
2013/06/04 PHP
浅谈PHP强制类型转换,慎用!
2013/06/06 PHP
微信公众号开发之获取位置信息php代码
2018/06/13 PHP
html下载本地
2006/06/19 Javascript
对google个性主页的拖拽效果的js的完整注释[转]
2007/04/10 Javascript
js 判断一个元素是否在页面中存在
2012/12/27 Javascript
jquery foreach使用示例
2013/09/12 Javascript
ext combobox动态加载数据库数据(附前后台)
2014/06/17 Javascript
Javascript基础教程之定义和调用函数
2015/01/18 Javascript
使用 stylelint检查CSS_StyleLint
2016/04/28 Javascript
JavaScript 函数的执行过程
2016/05/09 Javascript
JavaScript中0和&quot;&quot;比较引发的问题
2016/05/26 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
JS实现的幻灯片切换显示效果
2016/09/07 Javascript
微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例
2016/10/13 Javascript
jQuery 常见小例汇总
2016/12/14 Javascript
实例讲解DataTables固定表格宽度(设置横向滚动条)
2017/07/11 Javascript
nodejs 图片预览和上传的示例代码
2017/09/30 NodeJs
Vue使用路由钩子拦截器beforeEach和afterEach监听路由
2020/11/16 Javascript
vue3.0 自适应不同分辨率电脑的操作
2021/02/06 Vue.js
深入理解Python装饰器
2016/07/27 Python
Python 网页解析HTMLParse的实例详解
2017/08/10 Python
django 在原有表格添加或删除字段的实例
2018/05/27 Python
python 日期排序的实例代码
2019/07/11 Python
python3实现mysql导出excel的方法
2019/07/31 Python
python实现快速文件格式批量转换的方法
2020/10/16 Python
基于Python实现粒子滤波效果
2020/12/01 Python
python字符串拼接+和join的区别详解
2020/12/03 Python
中东地区为妈妈们提供一切的头号购物目的地:Sprii
2018/05/06 全球购物
Bibloo荷兰:女士、男士和儿童的服装、鞋子和配饰
2019/02/25 全球购物
心得体会开头
2014/01/01 职场文书
考试退步检讨书
2014/01/15 职场文书
营销总监岗位职责范本
2014/02/26 职场文书
销售人员求职信
2014/07/22 职场文书
应届生求职自荐信范文
2015/03/04 职场文书
Sql Server之数据类型详解
2022/02/28 SQL Server