zoukankan      html  css  js  c++  java
  • 当你的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(",");
            })
    

      

  • 相关阅读:
    关于matplotlib绘制直方图偏移的问题
    XP下 无法定位程序输入点WSAPoll于动态链接库ws2_32.dll 的解决办法
    Ubuntu 拨号上网及校园网开启IPV6
    php性能优化
    Mac OS X 10.11.6 重置root密码
    php 接口类与抽象类的实际作用
    Redis Cluster集群的搭建与实践
    nginx 反向代理 取得真实IP和域名
    mysql主从配置,出错
    mycat水平分片规则
  • 原文地址:https://www.cnblogs.com/nangras/p/10612823.html
Copyright © 2011-2022 走看看