当你的layui表格要做全选+删除功能【兼容ie8】
<!-- 全选 -->
<div class="choose">
<input type="checkbox" id="chooseAll" name="" title="全选" lay-skin="primary" onclick="chooseall">
<span onclick="delAll()" lay-submit lay-filter="delete">删除记录</span>
</div>
<td>
<!-- <input type="checkbox"> -->
<input type="checkbox" data-id="{{ item.id }}" lay-skin="primary" name="idList[]" value="{{item.id}}">
</td>
// 全选/取消全选
var flag = true;
var chooseAllstr = '';
$('.choose').on('click', '.layui-form-checkbox', function() {
var cb = $(".layui-form-checkbox");
$(".layui-form-checkbox").each(function() {
if (flag) {
$(this).addClass('layui-form-checked')
} else {
$(this).removeClass('layui-form-checked')
}
})
flag = !flag;
})
// 删除全选的数据
function delAll() {
chooseAllstr = '';
$(".layui-form-checked").each(function() {
if ($(this).parent().find('input').data("id") && $(this).parent().find('input').data("id") != undefined) {
chooseAllstr += $(this).parent().find('input').data("id") + ','
}
})
if (chooseAllstr != '') {
//询问框
layer.confirm('确认删除全部记录吗?', {
btn: ['删除', '取消'] //按钮
}, function() {
ajax('/pu/ScancodeBehavior/Delete', { idList: chooseAllstr }, function(data) {
if (data.success) {
layer.closeAll();
popupSuccess(data.msg);
getList(param, function(data) {
if (Number(data.count) != 0) {
var getTpl = tabletpl.innerHTML,
view = document.getElementById('table-adm');
laytpl(getTpl).render(data.list, function(html) {
view.innerHTML = html;
});
-------------------------------------------------------------------
如果想用layui的name属性获取选中的数据:
<span lay-submit lay-filter="deteleSubmit">删除记录</span>
拼接为逗号分割的字符串,供接口传参,进行删除
form.on('submit(deteleSubmit)', function(data) {
var shuzu = [];
var arr = '';
Object.keys(data.field).forEach(function(key) {
shuzu.push(data.field[key]);
});
arr = shuzu.join(",");
})
当你的layui表格要做全选+删除功能【兼容ie8】的更多相关文章
- vue实战记录(五)- vue实现购物车功能之商品总金额计算和单选全选删除功能
vue实战,一步步实现vue购物车功能的过程记录,课程与素材来自慕课网,自己搭建了express本地服务器来请求数据 作者:狐狸家的鱼 本文链接:vue实战-实现购物车功能(五) GitHub:sue ...
- checkbox做全选按钮
1.先写一个html页面,里面写一个全选按钮和几个复选框,实现下面2个要求 (1)点击全选按钮选中时,所有的复选框选中. (2)点击全选按钮取消选中时,所有复选框取消选中. <input typ ...
- 11月8日下午Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格
1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格
1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- 11.8 开课二个月零四天 (Jquery取属性值,做全选,去空格)
1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- php大力力 [042节] 今天做了一个删除功能
php大力力 [042节] 今天做了一个删除功能 if(isset($_GET['action'])){ if($_GET['action']=="del"){ $sql = &q ...
- jquery 书写全选反选功能
书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- JavaScript 实现全选 / 反选功能
JavaScript 实现全选 / 反选功能 版权声明:未经授权,内容严禁转载! 构建主体界面 编写 HTML 代码 和 CSS 代码,设计主题界面 <style> #user { wid ...
- DevExpress 中 在做全选的全消功能的时候 加快效率
在做 DevExpress 中对增加的选择 Check列 控制全选的全消时通过以下代码红色字代码效率会有明显的提升: private void CheckedRow() { try { splashS ...
随机推荐
- python pprint模块
pprint模块 提供了打印出任何python数据结构类和方法. 模块方法: 1.class pprint.PrettyPrinter(indent=1,width=80,depth=None, st ...
- html中div标签怎么用?
div现在一般网页的布局都是使用的div+css来布局,div的话,就是通过. <div> <div><p></p></div> </ ...
- 安卓BLE测试apk
安卓蓝牙测试APP 文件下载:蓝牙测试.apk
- 对比剖析Swarm Kubernetes Marathon编排引擎
Docker Native Orchestration 基本结构 Docker Engine 1.12 集成了原生的编排引擎,用以替换了之前独立的Docker Swarm项目.Docker原生集群(S ...
- Git仓库完全迁移,包括所有的分支和标签,当然也包括日志
一.删除原有远程仓库地址 git remote rm origin 添加新的仓库地址 cd existing_repo git remote add origin <URL> git pu ...
- React Native之配置开发环境
安装前注意: 1)在Max OS X 10.11(El Capitan)版本中,homebrew在安装软件时可能会碰到/usr/local目录不可写的权限问题.可以使用下面的命令修复: sudo ch ...
- Python游戏编程入门
<Python游戏编程入门>这些文章负责整理在这本书中的知识点.注意事项和课后习题的尝试实现.并且对每一个章节给出的最终实例进行分析和注释. 初识pygame:pie游戏pygame游戏库 ...
- Redhat乱码
1 首先可以使用echo $LANG命令输出当前字符集. 2 我们需要把字符集改为zh_CN.UTF-8,在/etc/sysconfig/i18n文件中进行修改 3 使用source /etc/sy ...
- Thinkphp5.0 多图上传名称重复BUG
- Java核心知识盘点(二)- 缓存使用
Redis有哪些数据类型 String.Hash.List.Set.ZSet String:字符串 Hash:哈希 Set:集合 List:列表 ZSet:有序集合 Redis内部结构 1.Redis ...