How to get table data in layui

Methods to obtain table data in layui: 1. Create a js object array to save the original data in the table; 2. Assign the data parameter of [table.render()] to the object array; 3. Just get the data in tableContent.

The operating environment of this tutorial: Windows 10 system, layui version 2.5.6. This method is suitable for all brands of computers.

Ideas:

1. Create a JS object array with a suitable scope to save the original data in the data table.

2. Assign the JS object array created in the previous step, which is the original data, to the data parameter of table.render().

3. To get all the data in the table, you can directly get the JS object array created in the first step. Refer to the following code, to get all the data in the table is to get the data in tableContent.

Code implementation:

// 存放数据表格中的数据的对象数组tableContent
var tableContent = new Array();

table.render({
 elem : '#viewTable',
 height : 325,
 even: true,
 text: {
 none: '您没有选中任何字段！'
 },
 // 拿对象数组tableContent中的数据作为原始数据渲染数据表格
 data : tableContent, 
 page : {
 layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
 },
 limit : 5,
 limits : [5, 10, 15, 20, 25],
 cellMinWidth: 80,
 cols:[[
 {type:'checkbox',fiexd : 'left'},
 {title : '序号',type:'numbers'},
 {field : 'column',title : '列',align:'center'},
 {field : 'alias',title : '别名',align:'center',edit : 'text'},
 {title : '操作',fiexd : 'right',align:'center', toolbar: '#viewBar'}
 ]],
 done : function(res, curr, count){
 // do something...
 }
});

The data in the data table is obtained through asynchronous request

It can be obtained directly through the done parameter of table.render(), which parameter The value is a callback after the data is rendered. Whether it is a direct assignment or an asynchronous request for data, the callback will be triggered after the rendering is completed. Note: When using the direct assignment method to the original data of Laytable, this method obtains the data of the current page in the data table, not all the data in the table. If you want to obtain all the data in the table, you must follow the above "The data in the data table is "Through direct assignment" method

table.render({ //其它参数在此省略
 done: function(res, curr, count){
 //如果是异步请求数据方式，res即为你接口返回的信息。
 //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
 console.log(res);
 //得到当前页码
 console.log(curr);
 //得到数据总量
 console.log(count);
 }
});

Related recommendations:layui

The above is the detailed content of How to get table data in layui. For more information, please follow other related articles on the PHP Chinese website!