Layui 带多选框表格监听事件以及按钮自动点击写法实例

不话不多说了,直接上代码吧:

<div class=\"layui-btn-group demoTable\" style=\"margin: 10px;\">
  <button class=\"layui-btn\" id=\"hqsj\" data-type=\"getCheckData\">获取选中行数据</button>
  <button class=\"layui-btn\" data-type=\"getCheckLength\">获取选中数目</button>
  <button class=\"layui-btn\" data-type=\"isAll\">验证是否全选</button>
  <button class=\"layui-btn\" style=\"right: 30px;\" οnclick=\"submitmychose()\">提交选择</button>
</div>
<table class=\"layui-table\" lay-data=\"{width: 990, height:495, url:\'<%=request.getContextPath()%>/admin/getSportcuDate\', id:\'idTest\'}\" lay-filter=\"demo\">
  <thead>
    <tr>
      <th lay-data=\"{type:\'checkbox\',width:80,fixed: \'left\'}\"></th>
      <th lay-data=\"{field:\'sportId\',width:100, sort: true, fixed: true}\">ID</th>
      <th lay-data=\"{field:\'sportName\',width:290}\">运动名</th>
      <th lay-data=\"{field:\'sportTime\',width:270, sort: true}\">运动时长</th>
      <th lay-data=\"{field:\'sortId\', width:225}\">运动类型</th>
    </tr>
  </thead>
</table>

<script>
var msg=\"\";
var idlist=\"\";
layui.use(\'table\', function(){
      var table = layui.table;
      
      //监听表格复选框选择
      table.on(\'checkbox(demo)\', function(obj){
          
      });
      
      var $ = layui.$, active = {
        getCheckData: function(){ //获取选中数据
            msg=\"\";
            idlist=\"\";
          var checkStatus = table.checkStatus(\'idTest\')
          ,data = checkStatus.data;
        for(var i=0; i<data.length;i++){
          msg=msg+\"周\"+(i+1)+\":\"+data[i].sportName+\" \";
          idlist =idlist+data[i].sportId+\",\";
        }
        }
        ,getCheckLength: function(){ //获取选中数目
          var checkStatus = table.checkStatus(\'idTest\')
          ,data = checkStatus.data;
          layer.msg(\'选中了:\'+ data.length + \' 个\');
        }
        ,isAll: function(){ //验证是否全选
          var checkStatus = table.checkStatus(\'idTest\');
          layer.msg(checkStatus.isAll ? \'全选\': \'未全选\')
        }
      };
      $(\'.demoTable .layui-btn\').on(\'click\', function(){
        var type = $(this).data(\'type\');
        active[type] ? active[type].call(this) : \'\';
      });
    });
    function submitmychose(){
        $(\'#hqsj\').trigger(\"click\");
        
    }
</script>

以上这篇Layui 带多选框表格监听事件以及按钮自动点击写法实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容