zoukankan      html  css  js  c++  java
  • 数据列表的全选、反选以及批量操作

    数据列表的全选、反选以及批量操作

    html部分代码:
    1、全选的checkbox: <input type="checkbox" value="" id="all_columnId">
    2、每条数据前边的checkbox:<input type="checkbox" name="columnId" class="chrId" value="<% $Item.Id %>">

    js代码部分:
    全选与反选:
    $("#all_columnId").on("click", function(){
    if (this.checked) {
    $("[name=columnId]:checkbox").prop("checked", this.checked);
    //有模板才显示删除按钮
    var check_value = [];
    ((&quot;input[name='columnId']:checked&quot;).each(function(){ check_value.push()(this).val());
    });
    console.log(check_value);
    check_value = $.grep(check_value, function(n){
    return $.trim(n).length > 0;
    });
    if(check_value.length > 0){
    $("#batch_del_fields").show();
    }
    }else{
    $("[name=columnId]:checkbox").prop("checked", this.checked);
    $("#batch_del_fields").hide();
    }
    });
    $(".table").on("click","input[name='columnId']",function(){
    var check_value = [];
    ((&quot;input[name='columnId']:checked&quot;).each(function(){ check_value.push()(this).val());
    });
    console.log(check_value);
    check_value = $.grep(check_value, function(n){
    return $.trim(n).length > 0;
    });
    var $columnId = $("input[name='columnId']");
    if(check_value.length > 0){
    $('#batch_del_fields').show();
    }else{
    $('#batch_del_fields').hide();
    }
    ((&quot;#all_columnId&quot;).prop(&quot;checked&quot;,)columnId.length == $columnId.filter(":checked").length ? true : false);
    });

    操作部分:一般是批量删除、批量审核等
    $("#batch_del_fields").click(function(){
    //获取选中的
    var check_value = [];
    ((&quot;input[name='columnId']:checked&quot;).each(function(){ check_value.push()(this).val());
    });
    //check_value就是选中的部分,数组形式
    console.log(check_value);
    //在这下边执行异步删除等操作
    });

  • 相关阅读:
    Stacks And Queues
    Programming Assignment 5: Burrows–Wheeler Data Compression
    Data Compression
    Regular Expressions
    Programming Assignment 4: Boggle
    Oracle 查询表的索引包含的字段
    pycharm
    Java文件:追加内容到文本文件
    okhttp 使用response.body().string()获取到的数据是一堆乱码
    彻底解决unable to find valid certification path to requested target
  • 原文地址:https://www.cnblogs.com/alisleepy/p/9982456.html
Copyright © 2011-2022 走看看