精华内容
下载资源
问答
  • 3、获取表格中所有数据其实直接获取第一步创建的JS对象数组即可,参照下面的代码,获取表格中所有数据就是获取tableContent数据。 // 存放数据表格数据的对象数组tableContent var tableContent = ...
  • layui 获取表格所有数据

    千次阅读 2020-04-17 09:42:36
    版本2.2.6 使用 layui.table.cache.tablename layui.table.cache["表ID"];
    版本2.2.6 中 使用 layui.table.cache.tablename
    
    layui.table.cache["表ID"];
    
    展开全文
  • 关于layUI获取表格中复选框对应数据的方法 今天在做博客后台项目最后一个功能,就是使用layUI的多选功能进行删除勾选数据 如: 去网上百度了各种方法,无一不是特别麻烦。就想了另外的一种方案: 复选框用的是layUI...

    关于layUI获取表格中复选框对应数据的方法

    今天在做博客后台项目最后一个功能,就是使用layUI的多选功能进行删除勾选数据
    如:
    在这里插入图片描述
    去网上百度了各种方法,无一不是特别麻烦。就想了另外的一种方案:

    复选框用的是layUI的标签:

     <div class="layui-unselect header layui-form-checkbox" lay-skin="primary">
     	<i class="layui-icon">&#xe605;</i>
     </div>
    

    红色批量删除按钮标签:

    <button class="layui-btn layui-btn-danger" onclick="delAll()">
    	<i class="layui-icon"></i>批量删除
    </button>
    

    button标签内置一个deall()函数;
    下面是deall()代码:

          function delAll (argument) {
    		  var data = tableCheck.getData();
           		
    		  //选中的个数
    		  var long = data.length;
    		  var arr = [];
    		  
    		  //给数组赋值选中的id
    		  for(var i=0;i<long;i++){
    		  	  //children('.td)为选中class为td的值,这个值为我们要选中的id.
    			  arr[i] = $(".layui-form-checked").not('.header').parents('tr').children('.td').eq(i).html();
    		  }
    
    		
            layer.confirm('确认要删除吗?'+data,function(index){
    
                layer.msg('删除成功', {icon: 1});
    		    //	将数据arr发送给php脚本处理
                $.post('http://blog.com/admin/server/acticleMove.php',{cid:arr},function(res){},'json');
    			$(".layui-form-checked").not('.header').parents('tr').remove();
            });
          }
    

    总结

    难点在于如何获得到勾选的值
    
      arr[i] = $(".layui-form-checked").not('.header').parents('tr').children('.td').eq(i).html();
    

    因为数据是遍历出来的,所以arr是一个数组,关键就在于给arr赋值
    最开始我用的是:

      arr[i] = $(".layui-form-checked").not('.header').parents('tr').children('.td').html();
    

    与上处相比少了一个eq(i),这就导致arr始终是一个值
    只有通过遍历才能把每个值都遍历出来并赋给arr数组

    此处有一个小知识点那就是js中数组的创建:

    var arr = [];
    //或者
    var arr = new Array();
    

    展开全文
  • Layui 获取表格id

    千次阅读 2019-07-05 16:47:31
    Layui 获取表格id 第一步:table表格要有 lay-filter 属性 <table class="app-table layui-table" id="reportTable" lay-filter="reportTable" lay-data="{id: 'reportTable'}"></table> 第二步:...

    Layui 获取表格id

    1. 第一步:table表格要有 lay-filter 属性

       <table class="app-table layui-table" id="reportTable" lay-filter="reportTable" lay-data="{id: 'reportTable'}"></table>
      
    2. 第二步:通过 table.checkStatus 获取,对应 lay-filter 属性,代码如下:

    // 任意button的按钮事件,比如新增
    function add() {
            var table = layui.table;
            var checkStatus = table.checkStatus('reportTable');
            var ids="";
            for(var i=0; i<checkStatus.data.length; i++){
                ids += checkStatus.data[i].id;
                if(i !=checkStatus.data.length-1){
                    ids += ",";
                }
            }
            console.log(ids)
        }
    

    在这里插入图片描述

    展开全文
  • layui数据表格导出所有数据

    千次阅读 2019-05-21 10:58:31
    前端: </button> <button class="layui-btn" id="export"> <i class="iconfont icon-export"></i> 导出 </button>...--数据表格--> <table class="layui-h...

    前端:

     </button>
            <button class="layui-btn" id="export">
                <i class="iconfont icon-export"></i> 导出
    </button>
    <!--数据表格-->
        <table class="layui-hide" id="table1" lay-filter="tableFilter"></table>
    

    注意:上面代码中“导出”按钮的id为“export”,表格的id为table1。

    js代码:

    <script>
        layui.use(['element', 'table', 'form', 'jquery', 'laydate','layer'], function () {
            var table = layui.table;         //表格
            var form = layui.form;           //表单
            var layer = layui.layer;         //弹层
            var $ = layui.jquery;
    		var exportData = " ";			//定义全局变量
    		
            var ins1=table.render({
                elem: '#table1',
                url: '',
                limit: 10,
                page:true,
                cols: [[
                    {type: 'checkbox'},
                    {field: 'id', title: 'ID',width:80, sort: true,align: 'center'},
                    {field: 'username', title: '用户名', sort: true,align: 'center'},
                    {field: 'status', title: '状态', templet: '#statusTpl',align: 'center'},
                    {field: 'role', title: '角色类型', templet: '#roleTpl',sort: true,align: 'center'},
                    {field: 'phone', title: '手机',align: 'center'},
                    {field: 'createTime', title: '创建时间',align: 'center'},
                    {field: 'lastLoginTime', title: '最近登录时间',align: 'center'},
                    {field: 'logins', title: '登陆次数',sort: true,align: 'center',width:100},
                    {fixed: 'right', title: '操作', align:'center', minWidth:160,toolbar: '#barDemo'}
                ]],
                done: function (res, curr, count) {
                    exportData=res.data; 		//获取表格中的数据集合。
                }
            });
    
            $("#export").click(function(){
    	       	table.exportFile(ins1.config.id,exportData, 'xls');
            })
        })
    </script>
    
    

    要点:
    1、在表格渲染完成后的回调函数中,定义一个全局变量exportData,让它取得表格中的数据集合。
    2、在导出数据时将变量exportData作为data变量传给table.exportFile(id, data, type) 函数。这样就大功告成了,怎么样,是不是很简单!
    3、需要说明的是:table.exportFile函数的第三个参数type默认是导出csv格式文件,要导出xls文件的话,把它设置成‘xls’就可以了。

    展开全文
  • 修改静态的表格过后,搞个触发事件打印出table的缓存,建议先打印table查看自己的table结构 不同的版本结构会不一样 我使用的是 var table; function tableData() { console.log(table.cache.JxDataTabel);//...
  • layui获取数据表格中数据并传到后台进行解析
  • layui 表格 获取所有数据

    万次阅读 2018-09-03 15:03:17
    版本2.2.6 中 使用 layui.table.cache.tablename 可以取到表格中所有数据 可以打印 console.log("data-----"+JSON.stringify(table.cache)); 看看
  • Layui获取表格数据与java实现多删除问题 【1】绑定数据表格 //1-页面数据加载 $(function () { console.log(music.volume ); //【1】加载&初始化layui模块 layui.use(["layer", "table",], function...
  • 一、修改layui表格中的数; 1、layui表格中开启输入框:edit:’text’; //渲染表格组件 tableInsT = table.render({ elem: '#tesc', url: '${pageContext.request.contextPath}/admin/compilation/list2?...
  • 主要介绍了layui数据表格实现重载数据表格功能,以搜索功能为例进行讲解,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 关于使用layui获取表格复选框选中的数据的方法

    万次阅读 热门讨论 2018-09-19 18:06:23
    使用layui获取表格复选框选中的数据 今天在实现根据表格复选框选中的内容进行一系列的操作,一下的内容是基于使用layui模块实现的。首先先简述比较简单的方法,在layui官方文档也是提到的方法。(本人文笔不好,很多...
  • 今天小编就为大家分享一篇解决Layui数据表格显示无数据提示的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 关于layui 获取表格数据为null的问题

    千次阅读 2019-12-06 14:06:26
    及时把官方演示的代码down下来,数据还是为null 把layui版本从2.5.4换成2.5.5就好了
  • 本文主要解决了layui数据表格数据导出, 将原本只能导出本页数据的导出功能...第一步:获取所有数据条数 var limitCount = ""; var tableIns = table.render({ elem: '#test' ,url: '/****' //数据接口 ,t...
  • layui 获取当前表格 最新数据

    千次阅读 2019-03-13 15:32:12
    获取当前表格数据(最新的数据) table.on('edit(tableTest)', function (obj) { var value = obj.value, //得到修改后的值 data = obj.data, //得到所在行所有键值 field = obj.field; //得到字段 ...
  • layui获取分页表格中所有的值

    千次阅读 2018-08-24 21:01:48
      我这里有两个 tab 用 id区分 使用封装的 layui.table.cache.id 就可以获取 table表格中数据了        
  • 前几天在使用layui的动态表格渲染数据的时候,使用ajax请求动态获取数据的时候,出现了undefined,我一直想不同是怎么回事,但是一想到ajax是异步请求,那就是说,差不多跟多线程一样,有点那个意思,就是ajax请求的...
  • layui中如何获取表格全部数据

    千次阅读 2020-10-14 17:03:31
    下面本篇文章给大家介绍一下layui中获取表格全部数据的方法。 layui中获取表格全部数据 第一步可以通过layui.table.cache["testReload"]的方式来获取表格全部数据,其中testReload是表格id 第二步打开网页...
  • 今天小编就为大家分享一篇layui使用表格渲染获取数据的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • layui 数据表格 ——后台数据获取

    万次阅读 2019-06-11 14:52:36
    <table id="userList" lay-filter="userList"></table> ... {field: 'userEmail', title: ...2.layui数据表格向url发送请求时,会附上page以及limit这两个参数,所以服务端需要接收并以此为条件查找数据  
  • layui数据表格获取数据

    千次阅读 2019-10-31 10:59:13
    思路步骤:1.请求后端的总条数 ...后端数据的格式顺序要与表头数据相同 3.table组件接受数据的格式为 table.render({ elem: '#demp' ,url: '' ,parseData: function(res){ //res 即...
  • layui使用表格渲染获取数据

    千次阅读 2018-08-28 11:03:23
    需求:使用前端框架layui生成表格,点击表格中一行数据中的按钮,获取到这行数据。 解决办法: 在render中增加字段: done: function (res, curr, count) { // $('.x-body').find('.layui-table-body').find(&...
  • <div class="layui-btn-container"> <button class="layui-btn la...
  • layui表格table选中数据后可打印本行数据,未打印时不显示,只在打印页面显示打印内容。只是做了一个简单的demo,页面需要自己去画,方法已实现。有具体的指导步骤
  • layui查询表格中数据

    2020-05-20 17:23:27
    form class="layui-form" id="searchForm" onsubmit="return false"> <input type="text" name="searchText" id="searchText" autocomplete="off" class="layui-input"> <button class="layui-btn ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 4,063
精华内容 1,625
关键字:

layui获取表格中所有数据