Layui数据表单的编辑
使用layui对单元格进行编辑并保存
先是要引入layui的JS和CSS
然后创建一个表格
而重要的是edit这个属性,只有使用了这个属性的一列数据表格才可以编辑,其余的都不可以进行编辑
然后使用layui的监听事件获取到数据
再声明1个全局变量用于装所在行的相关数据,当然我们需要的并不是所有的数据,而是加了edit这个属性的那一条数据,
var data =obj.data
var commodityName=data.CommodityName
1
2
3
obj是控制器返回给页面的值
commodityName是便于数据的使用
这样我们就能获取到修改后的数据了
我们只要CommodityName这个数据
再使用Post或者ajaxSubmit请求,传递将修改后数据给控制器,并保存
而保存的大概思路和一般的模态框保存基本相同
第一步先判断数据库是否有了相同的数据,如果有则返回false不进行保存
如果第一步判断成功后,就将查询要修改的数据,并将其状态改为修改
dbUser是查询出来的数据的一个集合名称
并将修改后的数据赋值给查询的这张表
然后返回数据给页面
这样一次只能保存一行数据
如果需要保存多行数据,就得每修改一次单元格就保存一次
而没有加上edit这个属性的列,是无法点击编辑
如果需要修改的数据较少,那么layui的数据表格编辑是一个很不错的方法
注意:
如果只是给表头加上edit属性,不写监听事件的话,一样是无法点击表格进行编辑,所以使用时一定要注意。
在查询数据是一定要记得去掉数据中的空格,防止保存数据时出错
那么一个简单的数据单元格的编辑就完成了
---------------------
Layui数据表单的编辑的更多相关文章
- 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize
1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...
- 修改layui的表单手机、邮箱验证可以为空怎么实现?
修改layui的表单手机.邮箱验证可以为空 解决办法: 修改源码: 把表单验证源代码(form.js)的正则表达式改一下,例如手机的正则为:/^1d{10}$/,可以改成/^$|^1d{10} ...
- layui之表单验证
这篇文章的表单验证我只是随便记录下,望各位看官理解 1.排序 验证 html代码 <div class="layui-form-item"> <label cla ...
- layui父表单获取子表单的值完成修改操作
最近在做项目时,学着用layui开发后台管理系统. 但在做编辑表单时遇到了一个坑. 点击编辑时会出现一个弹窗. 我们需要从父表单传值给子表单.content是传值给子表单 layer.open({ t ...
- layui+tp5表单提交回调
layui 前段页面form表单提交数据如果监听表单提交 ,tp5后台操作完成后使用 $this->success('success'); 后前端的页面不会出现layui的layer弹窗提示su ...
- layui form表单提交
layui.use(['form'], function () { var form = layui.form; //监听提交 form.on('submit(formDemo)', function ...
- layui 自定义表单验证的几个实例
*注:使用本方法请先引入layui依赖的layu.js和layui.css 1.html <input type="text" name="costbudget&q ...
- layui form表单自定义sm格式
1. 新建以下sm样式,保存为layform_sm.css文件名,然后导入到layui.css的后面. .layui-input-sm,.layui-select-sm,.layui-textarea ...
- layui 自定义表单验证 以及提交表单
订购数量</span> <span style="color: red">*</span>: <input type="text ...
随机推荐
- Eclipse或SVN—怎样在Eclipse中安装SVNclient插件
1.下载SVN插件,下载地址:http://download.csdn.net/download/wangshuxuncom/7638615 2.解压下载下来的压缩文件然后依据里面名为"使用 ...
- C语言中结构体变量之间赋值
近期,我阅读了某新员工小刘写的C语言代码,发现其对结构体变量之间的赋值不是非常熟悉. 对于两个同样类型的结构体变量,他均採用的是逐个成员变量直接赋值的形式.例如以下的代码演示样例: 如上代码所看到的, ...
- Mycat(5):聊天消息表数据库按月分表实践,平滑扩展
本文的原文连接是: http://blog.csdn.net/freewebsys/article/details/47003577 未经博主同意不得转载. 1,业务需求 比方一个社交软件,比方像腾讯 ...
- php与国付宝对接过程吐槽
最近.我们在打造全国第一家互联网+风险管理平台(避险谷)时.须要与第三方支付平台"国付宝"进行在线交易对接. 之前对接过支付宝 .感觉还非常easy,拿到国付宝的接口文档.我晕啊. ...
- Vijos 1565 多边形 【区间DP】
描述 zgx给了你一个n边的多边形,这个多边形每个顶点赋予一个值,每条边都被标上运算符号+或*,对于这个多边形有一个游戏,游戏的步骤如下:(1)第一步,删掉一条边:(2)接下来n-1步,每步对剩下的边 ...
- npm安装以及命令行
安装visual studio的时候,安装Node.js会同时安装npm 查看版本 PS C:\Users\clu\Desktop> npm --version5.6.0 PS C:\Users ...
- 实现SpringBoot登录
SpringBoot登录 https://www.cnblogs.com/jiekzou/p/9303871.html 通过前面10篇文章的学习,相信我们对SpringBoot已经有了一些了解,那么如 ...
- bzoj1036 [ZJOI2008]树的统计Count——LCT
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1036 LCT水题! 然而没有1A(咬牙)! 注意值有负数,所以取 max 的话要把作为“哨兵 ...
- Integer值判断是否相等问题
昨天在开发中遇到一个问题,定义了两个Integer变量,暂且定义为Integer a; Integer b; 这两个值由前端赋值并传到后台,前台传的是a = 12345, b = 12345, 但 ...
- Spark 多项式逻辑回归__二分类
package Spark_MLlib import org.apache.spark.ml.Pipeline import org.apache.spark.ml.classification.{L ...