layui点击数据表格添加或删除一行的例子


Posted in Javascript onSeptember 12, 2019

数据表格

t2 = {
      elem: '#test2',
      data: tableData2,
      page: false,
      width: $(parent.window).width()-50,
      cols: [[
        {type:'checkbox',field:'id'},
        {field:'cstMoldNo', title: '客户模号',edit:'text'},
        {field:'cstProdName', title: '产品名称',edit:'text'},
        {field:'material', title: '产品材料',edit:'text'},
        {field:'firstTryDate', title: '验证日期',edit:'text'},
        {field:'deliveryDate', title: '交货日期',edit:'text'},
        {field:'unit', title: '单位',edit:'text'},
        {field:'count',   title: '数量',edit:'text'},
        {field:'upTax',   title: '含税单价',edit:'text'},
        {field:'priceTax',    title: '含税金额',edit:'text'},
        {field:'remark', title: '备注',edit:'text'},
        {fixed: 'right', title: '操作',width: '10%',align: 'center',toolbar: '#barDemo'}
      ]]
    };

点击添加一行

document.getElementById('addsome2').addEventListener('click',function (data) {
      var oldData = table.cache["test2"];
      var data1={};
      oldData.push(data1);
      table.reload('test2',{data : oldData});
    });

点击删除一行

if(obj.event === "del"){
        layer.confirm("你确定要删除么?",{btn:['是的,我确定','我再想想']},
            function(){
              var oldData = table.cache["test2"];
              oldData.splice(obj.tr.data('index'),1);
              layer.msg("删除成功",{time: 10},function(){
                table.reload('test2',{data : oldData});
              });
            }
        )
      }

以上这篇layui点击数据表格添加或删除一行的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQuery 遮罩层实现(mask)实现代码
Jan 09 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
May 23 Javascript
使用JavaScript实现Java的List功能(实例讲解)
Nov 07 Javascript
node.js入门教程迷你书、node.js入门web应用开发完全示例
Apr 06 Javascript
JavaScript实现找质数代码分享
Mar 24 Javascript
jQuery中的Deferred和promise 的区别
Apr 03 Javascript
Javascript基于jQuery UI实现选中区域拖拽效果
Nov 25 Javascript
vue-resource 拦截器使用详解
Feb 21 Javascript
详解vue-resource promise兼容性问题
Jun 20 Javascript
Angular动画实现的2种方式以及添加购物车动画实例代码
Aug 09 Javascript
Vue中Axios从远程/后台读取数据
Jan 21 Javascript
原生js实现下拉框选择组件
Jan 20 Javascript
小程序如何支持使用 async/await详解
Sep 12 #Javascript
layui清空,重置表单数据的实例
Sep 12 #Javascript
layui table 多行删除(id获取)的方法
Sep 12 #Javascript
详解Vue中CSS样式穿透问题
Sep 12 #Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 #Javascript
微信小程序之 catalog 切换实现解析
Sep 12 #Javascript
layui实现checkbox的目录树tree的例子
Sep 12 #Javascript
You might like
Amazon Prime Video平台《无限住人 -IMMORTAL-》2020年开始TV放送!
2020/03/06 日漫
如何使用Linux的Crontab定时执行PHP脚本的方法
2011/12/19 PHP
php实现多城市切换特效
2015/08/09 PHP
PHP依赖注入(DI)和控制反转(IoC)详解
2017/06/12 PHP
解决PHP Opcache 缓存刷新、代码重载出现无法更新代码的问题
2020/08/24 PHP
PHP终止脚本运行三种实现方法详解
2020/09/01 PHP
PHP基于进程控制函数实现多线程
2020/12/09 PHP
出现“不能执行已释放的Script代码”错误的原因及解决办法
2007/08/29 Javascript
Javascript hasOwnProperty 方法 & in 关键字
2008/11/26 Javascript
jquery实现心算练习代码
2010/12/06 Javascript
JQuery文本框高亮显示插件代码
2011/04/02 Javascript
javascript使用for循环批量注册的事件不能正确获取索引值的解决方法
2014/12/20 Javascript
js随机生成26个大小写字母
2016/02/12 Javascript
微信js-sdk上传与下载图片接口用法示例
2016/10/12 Javascript
javascript中的后退和刷新实现方法
2016/11/10 Javascript
vue.js利用defineProperty实现数据的双向绑定
2017/04/28 Javascript
微信小程序 新建登录页并实现tabBar隐藏
2017/06/13 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
2018/07/03 jQuery
微信小程序实现漂亮的弹窗效果
2020/05/26 Javascript
Javascript 实现 Excel 导入生成图表功能
2018/10/22 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
2019/05/31 Javascript
微信小程序手动添加收货地址省市区联动
2020/05/18 Javascript
[02:05]2014DOTA2西雅图邀请赛 专访啸天mik夫妻档
2014/07/08 DOTA
python实现通过pil模块对图片格式进行转换的方法
2015/03/24 Python
python实现淘宝秒杀聚划算抢购自动提醒源码
2020/06/23 Python
python属于解释型语言么
2020/06/15 Python
python调用win32接口进行截图的示例
2020/11/11 Python
武汉某公司的C#笔试题面试题
2015/12/25 面试题
给儿子的表扬信
2014/01/15 职场文书
领导党性分析材料
2014/02/15 职场文书
计算机专业职业规划
2014/02/28 职场文书
体育口号大全
2014/06/18 职场文书
普通党员对照检查材料
2014/09/24 职场文书
2016习总书记系列重要讲话心得体会
2016/01/15 职场文书
学习计划是什么
2019/04/30 职场文书
Go 语言下基于Redis分布式锁的实现方式
2021/06/28 Golang