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 09 Javascript
理解Javascript_06_理解对象的创建过程
Oct 15 Javascript
jQuery控制Div拖拽效果完整实例分析
Apr 15 Javascript
javascript实现点击后变换按钮显示文字的方法
May 13 Javascript
javascript匀速运动实现方法分析
Jan 08 Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 Javascript
AngularJS使用ng-Cloak阻止初始化闪烁问题的方法
Nov 03 Javascript
JavaScript禁止微信浏览器下拉回弹效果
May 16 Javascript
在Mac下彻底卸载node和npm的方法
May 16 Javascript
Intellij IDEA搭建vue-cli项目的方法步骤
Oct 20 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
Dec 28 Javascript
vue 开发之路由配置方法详解
Dec 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实现网上点歌(二)
2006/10/09 PHP
php explode函数实例代码
2012/02/27 PHP
curl和libcurl的区别简介
2015/07/01 PHP
laravel框架实现为 Blade 模板引擎添加新文件扩展名操作示例
2020/01/25 PHP
javascript 计算两个整数的百分比值
2009/12/26 Javascript
Javascript string 扩展库代码
2010/04/09 Javascript
基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
2010/06/10 Javascript
jQuery EasyUI API 中文文档 - Documentation 文档
2011/09/29 Javascript
jquery实现个人中心导航菜单效果和美观都非常不错
2014/09/02 Javascript
原生Ajax 和jQuery Ajax的区别示例分析
2014/12/17 Javascript
在父页面得到zTree已选中的节点的方法
2015/02/12 Javascript
JavaScript使表单中的内容显示在屏幕上的方法
2015/06/29 Javascript
jQuery采用连缀写法实现的折叠菜单效果
2015/09/18 Javascript
WEB前端开发都应知道的jquery小技巧及jquery三个简写
2015/11/15 Javascript
JavaScript评论点赞功能的实现方法
2017/03/13 Javascript
在Vue中使用echarts的实例代码(3种图)
2017/07/10 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
微信小程序实现banner图轮播效果
2020/06/28 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
2019/05/22 Javascript
vue-router的hooks用法详解
2020/06/08 Javascript
python批量提取word内信息
2015/08/09 Python
Python用threading实现多线程详解
2017/02/03 Python
python中OrderedDict的使用方法详解
2017/05/05 Python
python调用百度语音REST API
2018/08/30 Python
Python中的引用知识点总结
2019/05/20 Python
django 框架实现的用户注册、登录、退出功能示例
2019/11/28 Python
如何将Pycharm中调整字体大小的方式设置为"ctrl+鼠标滚轮上下滑"
2020/11/17 Python
关于canvas绘制模糊问题的解决方法
2019/09/24 HTML / CSS
实习生自我鉴定
2013/12/12 职场文书
运动会稿件300字
2014/02/14 职场文书
大学运动会入场词
2014/02/22 职场文书
班长演讲稿范文
2014/04/24 职场文书
销售团队口号大全
2014/06/06 职场文书
离婚协议书的书写要求
2014/09/17 职场文书
入党积极分子培养人意见
2015/06/02 职场文书
2019年大学生职业生涯规划书
2019/03/25 职场文书