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 相关文章推荐
Ext.MessageBox工具类简介
Dec 10 Javascript
javascript 中that的含义示例介绍
May 14 Javascript
js的toLowerCase方法用法实例
Jan 27 Javascript
JavaScript添加随滚动条滚动窗体的方法
Feb 23 Javascript
Javascript 函数的四种调用模式
Nov 05 Javascript
jquery获取table指定行和列的数据方法(当前选中行、列)
Nov 07 Javascript
js拖拽功能实现代码解析
Nov 28 Javascript
jquery网页加载进度条的实现
Jun 01 jQuery
JavaScript实现图片切换效果
Aug 12 Javascript
JS内部事件机制之单线程原理
Jul 02 Javascript
vue单文件组件lint error自动fix与styleLint报错自动fix详解
Jan 08 Javascript
实例分析JS中的相等性判断===、 ==和Object.is()
Nov 17 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
实用函数10
2007/11/08 PHP
PHP 字符串编码截取函数(兼容utf-8和gb2312)
2009/05/02 PHP
PHP开发的一些注意点总结
2010/10/12 PHP
PHP使用Mysql事务实例解析
2014/09/08 PHP
PHP中TP5 上传文件的实例详解
2017/07/31 PHP
PHP hex2bin()函数用法讲解
2019/02/25 PHP
php设计模式之工厂模式用法经典实例分析
2019/09/20 PHP
一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子
2014/06/26 Javascript
javascript实时显示北京时间的方法
2015/03/12 Javascript
JSON与XML优缺点对比分析
2015/07/17 Javascript
深入理解jQuery事件绑定
2016/06/02 Javascript
JS HTML5拖拽上传图片预览
2016/07/18 Javascript
Node.js + Redis Sorted Set实现任务队列
2016/09/19 Javascript
详解使用vue实现tab 切换操作
2017/07/03 Javascript
Bootstrap图片轮播效果详解
2017/10/17 Javascript
javascript+html5+css3自定义弹出窗口效果
2017/10/26 Javascript
24行JavaScript代码实现Redux的方法实例
2019/11/17 Javascript
Python中对象迭代与反迭代的技巧总结
2016/09/17 Python
Python与Java间Socket通信实例代码
2017/03/06 Python
Python中查看文件名和文件路径
2017/03/31 Python
Python中xml和json格式相互转换操作示例
2018/12/05 Python
Python从文件中读取指定的行以及在文件指定位置写入
2019/09/06 Python
Python 装饰器原理、定义与用法详解
2019/12/07 Python
Python GUI编程学习笔记之tkinter事件绑定操作详解
2020/03/30 Python
python实现控制台输出彩色字体
2020/04/05 Python
基于python实现操作redis及消息队列
2020/08/27 Python
九年级体育教学反思
2014/01/23 职场文书
情人节寄语大全
2014/04/11 职场文书
婚前保证书
2014/04/29 职场文书
清明节网上祭英烈活动总结
2014/04/30 职场文书
党支部三严三实对照检查材料思想汇报
2014/09/29 职场文书
公安局副政委班子个人对照检查材料
2014/10/04 职场文书
药房管理制度范本
2015/08/06 职场文书
2016年春季运动会广播稿
2015/08/19 职场文书
MySQL入门命令之函数-单行函数-流程控制函数
2021/04/05 MySQL
解决golang结构体tag编译错误的问题
2021/05/02 Golang