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的监控数据是否发生改变
Apr 11 Javascript
js获取height和width的方法说明
Jan 06 Javascript
利用jq让你的div居中的好方法分享
Nov 21 Javascript
js写的方法实现上传图片之后查看大图
Mar 05 Javascript
使用npm发布Node.JS程序包教程
Mar 02 Javascript
设置jQueryUI DatePicker默认语言为中文
Jun 04 Javascript
详解angularJs中关于ng-class的三种使用方式说明
Jun 02 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
Jun 17 Javascript
vue router 跳转时打开新页面的示例方法
Jul 28 Javascript
JS浮点数运算结果不精确的Bug解决
Aug 01 Javascript
详解vue beforeEach 死循环问题解决方法
Feb 25 Javascript
jquery检测上传文件大小示例
Apr 26 jQuery
小程序如何支持使用 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
如何利用php+mysql保存和输出文件
2006/10/09 PHP
PHP实现的蚂蚁爬杆路径算法代码
2015/12/03 PHP
php array_chunk()函数用法与注意事项
2019/07/12 PHP
JavaScript 面向对象的 私有成员和公开成员
2010/05/13 Javascript
JS中eval函数的使用示例
2013/07/21 Javascript
基于jquery编写的横向自适应幻灯片切换特效的实例代码
2013/08/06 Javascript
JavaScript中的console.trace()函数介绍
2014/12/29 Javascript
TypeOf这些知识点你了解吗
2016/02/21 Javascript
微信小程序购物商城系统开发系列-工具篇的介绍
2016/11/21 Javascript
angularjs中ng-attr的用法详解
2016/12/31 Javascript
Ionic 2 实现列表滑动删除按钮的方法
2017/01/22 Javascript
js阻止默认右键的下拉菜单方法
2018/01/02 Javascript
Bootstrap table表格初始化表格数据的方法
2018/07/25 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
详解ES6 Symbol 的用途
2018/10/14 Javascript
微信小程序基础教程之worker线程的使用方法
2019/07/15 Javascript
uni-app 支持多端第三方地图定位的方法
2020/01/03 Javascript
解决Antd Table组件表头不对齐的问题
2020/10/27 Javascript
Django中模版的子目录与include标签的使用方法
2015/07/16 Python
python 爬虫出现403禁止访问错误详解
2017/03/11 Python
Django CBV与FBV原理及实例详解
2019/08/12 Python
关于python 跨域处理方式详解
2020/03/28 Python
浅谈keras中的Merge层(实现层的相加、相减、相乘实例)
2020/05/23 Python
Python读写压缩文件的方法
2020/07/30 Python
python 进制转换 int、bin、oct、hex的原理
2021/01/13 Python
Python爬虫+tkinter界面实现历史天气查询的思路详解
2021/02/22 Python
开发人员所需要知道的HTML5性能分析面面观
2012/07/05 HTML / CSS
英国男士时尚购物网站:Stuarts London
2017/10/22 全球购物
顶丰TOPPIK台湾官网:增发纤维假发,告别秃发困扰
2018/06/13 全球购物
娇韵诗俄罗斯官方网站:Clarins俄罗斯
2020/10/03 全球购物
写一个用矩形法求定积分的通用函数
2012/11/08 面试题
岗位职责的含义
2013/11/17 职场文书
创业者是否需要商业计划书?
2014/02/07 职场文书
入党积极分子对十八届四中全会期盼的思想汇报
2014/10/17 职场文书
校园运动会广播稿
2015/08/19 职场文书
生活委员竞选稿
2015/11/21 职场文书