当前位置: 首页 > news >正文

layui移除(删除)table表格的一行

表格里添加删除按钮:

         , {field: 'wealth', width: 150, title: '操作', align: 'center', fixed: 'right',templet: function (item) {return '<a style="margin:0px 5px; color:red; cursor: pointer;" lay-event="delete" id="DeleteTr" >删除</a>';}}

添加 “delete”事件:

        //监听行工具事件table.on('tool(' + TableObj.tableId + ')', function (obj) {var data = obj.data;       //添加删除行if (obj.event === 'delete') {//alert('delete');layer.confirm('真的删除行么', function (index) {                  var cacheData = layui.table.cache[TableObj.tableId];//获取缓存obj.del();//①移除这一行var rowIndex = obj.tr.attr("data-index"); //获取行索引cacheData.splice(rowIndex, 1);  //②彻底移除元素,从缓存里移除这一行layer.close(index);//关闭弹窗});}});

图例:

 说明:

layui的table,光用  obj.del(); 去移除一行虽然看上去这一行没了。

但是table的缓存还存在这被移除的行数据,还需要移除它的缓存内容,如下:

var cacheData = layui.table.cache[TableObj.tableId];//获取talbe的缓存
obj.del();//删除行
var rowIndex = obj.tr.attr("data-index"); //获取行索引
cacheData.splice(rowIndex, 1); //从缓存里删除行数据

http://www.lryc.cn/news/206315.html

相关文章:

  • 67 跳跃游戏 II
  • 客户中心模拟(Queue and A, ACM/ICPC World Finals 2000, UVa822)rust解法
  • 方案聚焦:高可用的F5分布式云DNS负载均衡
  • 大数据性能测试方案-V1.0
  • Kafak - 单机/集群快速安装指北(3.x版本)
  • 互联网Java工程师面试题·Spring篇·第五弹
  • XTU-OJ 1221-Binary
  • Chromium源码由浅入深(三)
  • 如何集成验证码短信API到你的应用程序
  • Linux- 由映射文件I/O问题引出的SIGBUS 空洞文件(Sparse File)
  • 代码随想录图论 第二天 | 695. 岛屿的最大面积 1020. 飞地的数量
  • R语言代码示例
  • ESP32网络开发实例-将 ESP32 连接到 EMQX Cloud MQTT Broker
  • 基于Kubesphere容器云平台物联网云平台Devops实践
  • 淘宝商品详情页API接口|tb获取商品主图接口
  • JAVA面试笔记
  • 尚硅谷Flume(仅有基础)
  • JS中this的绑定规则
  • 酷开科技 | 酷开系统大屏电视,打造精彩家庭场景
  • GDPU 数据结构 天码行空6
  • 机器学习实验三:决策树-隐形眼镜分类(判断视力程度)
  • 广州华锐互动:VR技术应用到工程项目施工安全培训的好处
  • Hadoop3.0大数据处理学习1(Haddop介绍、部署、Hive部署)
  • C笔记:引用调用,通过指针传递
  • 【方法】如何给PDF文件添加“打开密码”?
  • 单源最短路径 -- Dijkstra
  • Java--多态及抽象类与接口
  • Python手搓C4.5决策树+Azure Adult数据集分析
  • 【tg】6: MediaManager的主要功能
  • NPM-安装报错connect ETIMEDOUT