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 相关文章推荐
javascript 特殊字符串
Feb 25 Javascript
jQuery EasyUI 中文API Button使用实例
Apr 14 Javascript
jquery multiSelect 多选下拉框
Jul 09 Javascript
JS简单实现表格排序功能示例
Dec 20 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
Dec 13 Javascript
浅谈Vue初学之props的驼峰命名
Jul 19 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
Dec 13 Javascript
浅谈layer弹出层按钮颜色修改方法
Sep 11 Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
Sep 18 Javascript
深入理解Antd-Select组件的用法
Feb 25 Javascript
Element Badge标记的使用方法
Jul 27 Javascript
通过实例解析JavaScript常用排序算法
Sep 02 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
PHP中error_reporting()函数的用法(修改PHP屏蔽错误)
2011/07/01 PHP
PHP实现的简单网络硬盘
2015/07/29 PHP
PHP substr()函数参数解释及用法讲解
2017/11/23 PHP
各种效果的jquery ui(接口)介绍
2008/09/17 Javascript
brook javascript框架介绍
2011/10/10 Javascript
一个JavaScript操作元素定位元素的实例
2014/10/29 Javascript
JavaScript插件化开发教程 (四)
2015/01/27 Javascript
基于jquery实现表格内容筛选功能实例解析
2016/05/09 Javascript
js简单实现图片延迟加载的方法
2016/07/19 Javascript
原生js图片轮播效果实现代码
2016/10/19 Javascript
JQuery和PHP结合实现动态进度条上传显示
2016/11/23 Javascript
layui选项卡效果实现代码
2017/05/19 Javascript
jQuery 添加样式属性的优先级别方法(推荐)
2017/06/08 jQuery
Django中使用jquery的ajax进行数据交互的实例代码
2017/10/15 jQuery
vue踩坑记录之数组定义和赋值问题
2019/03/20 Javascript
vue element-ul实现展开和收起功能的实例代码
2020/11/25 Vue.js
[01:07:47]Secret vs Optic Supermajor 胜者组 BO3 第一场 6.4
2018/06/05 DOTA
Python实现发送email的几种常用方法
2014/08/18 Python
用python记录运行pid,并在需要时kill掉它们的实例
2017/01/16 Python
Python 使用类写装饰器的小技巧
2018/09/30 Python
python实现小球弹跳效果
2019/05/10 Python
双立人美国官方商店:ZWILLING集团餐具和炊具
2020/05/07 全球购物
矫正人员思想汇报
2014/01/08 职场文书
材料员岗位职责
2014/03/13 职场文书
家长寄语大全
2014/04/02 职场文书
入党思想汇报怎么写
2014/04/03 职场文书
七夕情人节促销方案
2014/06/07 职场文书
公司总经理助理岗位职责
2014/07/09 职场文书
社会学专业求职信
2014/07/17 职场文书
学校党委干部个人对照检查材料思想汇报
2014/10/09 职场文书
党委书记个人检查对照材料思想汇报
2014/10/11 职场文书
2015年小学生新年寄语
2014/12/08 职场文书
英语演讲开场白
2015/05/29 职场文书
python自动统计zabbix系统监控覆盖率的示例代码
2021/04/03 Python
详解thinkphp的Auth类认证
2021/05/28 PHP
Python进程间的通信之语法学习
2022/04/11 Python