layui table 多行删除(id获取)的方法
如下所示:
<button class="layui-btn layui-btn-danger" data-type="getid" οnclick="delAll()">删除所有选中行</button>
js:
table.on('checkbox(table)', function(obj){ var data = obj.data; }); layui.jquery, active = { getid: function () { var arr = []; var checkStatus = table.checkStatus('tableid') , data = checkStatus.data; for (var i = 0; i < data.length; i++) { //循环筛选出id arr.push(data[i].id); } $("#ids").val(arr); } } $('.layui-btn').on('click', function(){ var type = $(this).data('type'); active[type] ? active[type].call(this) : ''; }); function delAll(){ layer.confirm('确定删除吗?', {btn: ['确定删除', '取消']}, function (index) { var a1 = $("#ids").val(); //取得已获取的ids $.ajax({ ....... }); }); }
以上这篇layui table 多行删除(id获取)的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
Layui之table中的radio在切换分页时无法记住选中状态的解决方法
情景描述 Layui数据表格中用到了表单元素radio,在当前页面选中radio状态,并同步更新到保存表格中所有的数据的数组中(获取表格中的所有数据并保存到数组中),再点击分页组件中的下一页.上一页.跳转按钮进行切换另外一个页面,然后在切换回之前的页面,会发现在以前页面上radio状态全部恢复默认了,我们当然是希望能保存住前一页radio的选中状态. 我写项目遇到的一个的情况:在第一页选中的radio的状态,点击下一页按钮切换到第二页,然后再点击上一页切换会第一页,第一页中的radio状态就恢复
-
Layui Table js 模拟选中checkbox的例子
思路,根据 data-index 找到 点击到的tr,获取tr下的 div,js 模拟点击 function iniTable() { layui.use('table', function(){ var table = layui.table; //展示已知数据 table.render({ elem: tableid ,cols: [[ //标题栏 {type:'checkbox',id:'goodsLimitSeqNo'} , {field: 'goodsLimitSeqNo', titl
-
解决layui数据表格table的横向滚动条显示问题
加上这段样式代码就可以解决了: <link type="text/css" rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" /> <style> body{overflow-y: scroll;} /* 禁止刷新后出现横向滚动条 */ </style> ps:这个问题fly社区给出的解释是:table 列
-
layui-table对返回的数据进行转变显示的实例
在使用layui表格时,在ajax请求回来的数据,有时候需要我们处理之后显示 1.比如性别sex这个字段,后台可能返回的是1.或者 2:那我们总不能显示1.和 2,我们需要显示男和女,这里就用到了自定义模板了 <script type="text/html" id="barDemo"> {{#if (d.sex == 1) { }} <span>男</span> {{# }else if(d.sex == 2){ }} <s
-
layui table数据修改的回显方法
实现的样式给你们看一波 点击这锅按钮 其实回显就是一个赋值的操作,先把form表单的那些input 框的id拿到,在展示成功的那里进行绑值 table.on('tool(test)', function(obj) { var data = obj.data; // 获得当前行数据 var layEvent = obj.event; // 获得 lay-event 对应的值(也可以是表头的event 参数对应的值) var tr = obj.tr; // 获得当前行 tr 的DOM对象 if (l
-
layui 实现table翻页滚动条位置保持不变的例子
最近使用了layui table但是发现了一系列问题,由于被封装过不好自己修改,比如翻页后滑动条每次都会复位,导致体验不好,通过调试,我发现layui table并没有给div加id标签,我通过class定位表格div位置. 可以看到 滚动条所在div class="layui-table-body layui-table-main" 我在layui table定义了一个父div,防止多个table时定位错误,先定位父div,再寻找内部的datatable <div class=
-
layui table设置某一行的字体颜色方法
table自带的可以设置某一个单元格颜色,必须根据内容来修改,对于很多列同时修改并不方便,直接使用js操作比较简单. 首先自定义一个div,内部存放table,根据class找到table,然后找到行tr,修改其样式中的颜色. //设置layui datatable的某一行的颜色 //TabDivId:tab父div id;RowIndex:行序列号,从0开始:ColorString:颜色字符串,如'#123456' function Layui_SetDataTableRowColor(Tab
-
layui table去掉右侧滑动条的实现方法
使用layui table后,table会自动有一个滑动条,使用时需要去掉,原理如下: 定义一个tab的父div id,在这个id中寻找 class为 layui-table-main,layui-form的标签,将高度设置为100%即可. //在layui table加载完成后,重新设置表格高度为100%,不限制表格高度,不会在表格上出现垂直滚动条 function AutoTableHeight() { var dev_obj = document.getElementById('table
-
layui table 多行删除(id获取)的方法
如下所示: <button class="layui-btn layui-btn-danger" data-type="getid" οnclick="delAll()">删除所有选中行</button> js: table.on('checkbox(table)', function(obj){ var data = obj.data; }); layui.jquery, active = { getid: functi
-
layui的table单击行勾选checkbox功能方法
如下所示: //单击行勾选checkbox事件 $(document).on("click",".layui-table-body table.layui-table tbody tr", function () { var index = $(this).attr('data-index'); var tableBox = $(this).parents('.layui-table-box'); //存在固定列 if (tableBox.find(".l
-
layui table 列宽百分比显示的实现方法
废话不多说了,为大家分享一下layui实现 table 列宽百分比显示的实例代码,希望对大家有所帮助吧 var layer = layui.layer, form = layui.form, table = layui.table; var $ = layui.$; /*select gysmc,zyzw ,xm ,sjhm ,bgshm ,emilyx , zgsrgzwsj ,zggsgl ,cast(gysxxid as int) as gysxxid, pc, gysryxxMdataI
-
layui table单元格事件修改值的方法
事件中的 this相当于document.getElementById("id") 替代方法就是将原本 document.getElementById("id").InnerHTML = "填充代码"; 替换成 $("#id").html("填充代码"); <!DOCTYPE html> <html> <head> <meta charset="utf-8
-
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
最近做的一个项目是基于 vue + AntDesign 的.由于项目要求,需要在 Table 组件的行内点右键的时候弹出菜单.在线演示地址及最终效果图如下: 在线演示地址>> 首先新建一个Table组件的实例: <a-table :columns="columns" :rowKey="record => { return record.INDEX;}" :dataSource="tableData" /> ... c
-
mybatis自动生成@Table、@Column、@Id注解的方法
在pom.xml中添加如下插件以及插件相关的依赖 <plugin> <groupId>org.mybatis.generator</groupId> <artifactId>mybatis-generator-maven-plugin</artifactId> <version>1.3.2</version> <configuration> <!--配置文件的位置--> <configurat
-
Linux命令行删除文件实操方法
rm命令 rm命令是大多数人在删除文件时经常使用的命令,它用于删除一个文件或者目录. rm命令的语法如下: rm /path/to/file 还可以删除文件夹和子文件夹中的所有文件,如下所示: rm -R /path/to/folder 文件一旦通过rm命令删除,则无法恢复,所以必须格外小心地使用该命令.但是,我们可以通过使用各种方法在某种程度上防止误删文件.例,如果要删除多个文件,则可以在删除每个文件之前得到提示,以便确保删除正确的文件. rm -i /path/to/file 每当运行上述命
-
layui table 复选框跳页后再回来保持原来选中的状态示例
layui table默认跳页后不存在源页面选中的状态.如果要实现记录源页面的选中状态,需要定义一个全局变量来记录数据选中状态. 1.修改table.js ;layui.define(["laytpl", "laypage", "layer", "form"], function (e) { "use strict"; var t = layui.$, i = layui.laytpl, a = layui
随机推荐
- 任意Json转成无序列表的方法示例
- jQuery实现带滚动导航效果的全屏滚动相册实例
- 制作Flash Loading 加载进度条
- 检测ip格式是否正确的批处理
- 浅析Java编程中类和对象的定义
- Java中的动态和静态编译实例详解
- 《解剖PetShop》之三:PetShop数据访问层之消息处理
- 获取客户端IP地址c#/vb.net各自实现代码
- asp.net 自动将汉字转换成拼音第一个字母
- 深入理解卡特兰数及其应用
- 详解Vue2 无限级分类(添加,删除,修改)
- Vue.js快速入门实例教程
- Android实现TextView字符串关键字变色的方法
- JavaScript 题型问答有答案参考
- toggle()隐藏问题的解决方法
- 用Java集合中的Collections.sort方法如何对list排序(两种方法)
- Linux中RPM文件操作的常用命令总结
- javascript 按键事件(兼容各浏览器)
- Android中使用TextView实现高仿京东淘宝各种倒计时效果
- Android数据加密之Aes加密