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 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
JavaScript 闭包在封装函数时的简单分析
Nov 28 Javascript
JS无限树状列表实现代码
Jan 11 Javascript
javascript自适应宽度的瀑布流实现思路
Feb 20 Javascript
取得元素的左和上偏移量的方法
Sep 17 Javascript
vue2.0开发实践总结之入门篇
Dec 06 Javascript
vue.js轮播图组件使用方法详解
Jul 03 Javascript
webpack4 处理CSS的方法示例
Sep 03 Javascript
Angular6 Filter实现页面搜索的示例代码
Dec 02 Javascript
Vue.Draggable拖拽功能的配置使用方法
Jul 29 Javascript
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
Sep 10 jQuery
如何用threejs实现实时多边形折射
May 07 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学习教程之第2天
2008/06/15 PHP
几行代码轻松实现PHP文件打包下载zip
2017/03/01 PHP
javascript中interval与setTimeOut的区别示例介绍
2014/03/14 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
JQuery日历插件My97DatePicker日期范围限制
2016/01/20 Javascript
JS实现的驼峰式和连字符式转换功能分析
2016/12/21 Javascript
详解vue2.0组件通信各种情况总结与实例分析
2017/03/22 Javascript
JS回调函数基本定义与用法实例分析
2017/05/24 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
2017/12/22 Javascript
layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法
2019/09/24 Javascript
在阿里云服务器上配置CentOS+Nginx+Python+Flask环境
2016/06/18 Python
Python配置mysql的教程(推荐)
2017/10/13 Python
Django中间件工作流程及写法实例代码
2018/02/06 Python
使用Python更换外网IP的方法
2018/07/09 Python
Python3爬取英雄联盟英雄皮肤大图实例代码
2018/11/14 Python
python中的数据结构比较
2019/05/13 Python
Python 一键获取百度网盘提取码的方法
2019/08/01 Python
Pandas 缺失数据处理的实现
2019/11/04 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
TensorFlow加载模型时出错的解决方式
2020/02/06 Python
Python2与Python3的区别详解
2020/02/09 Python
Numpy(Pandas)删除全为零的列的方法
2020/09/11 Python
PyTorch中的拷贝与就地操作详解
2020/12/09 Python
使用css3匹配手机屏幕横竖状态
2014/01/27 HTML / CSS
HTML5 Canvas实现文本对齐的方法总结
2016/03/24 HTML / CSS
NBA德国官方网上商店:NBA Store德国
2018/04/13 全球购物
bonprix匈牙利:女士、男士和儿童服装
2019/07/19 全球购物
企划主管岗位职责
2013/12/12 职场文书
三方合作协议书范本
2014/04/18 职场文书
2016年国培研修日志
2015/11/13 职场文书
《鸟的天堂》教学反思
2016/02/19 职场文书
检讨书格式
2019/04/25 职场文书
Python实现拼音转换
2021/06/07 Python
python模块与C和C++动态库相互调用实现过程示例
2021/11/02 Python
SQL Server数据库基本概念、组成、常用对象与约束
2022/03/20 SQL Server
python和C/C++混合编程之使用ctypes调用 C/C++的dll
2022/04/29 Python