Layui에서 테이블 데이터를 얻는 방법-레이이 튜토리얼-php.cn

Layui에서 테이블 데이터를 얻는 방법

王林

풀어 주다： 2020-11-30 10:01:48

원래의

16147명이 탐색했습니다.

layui에서 테이블 데이터를 얻는 방법: 1. js 객체 배열을 생성하여 테이블에 원본 데이터를 저장합니다. 2. [table.render()]의 데이터 매개변수를 객체 배열에 할당합니다. 그냥 데이터.

Layui에서 테이블 데이터를 얻는 방법
이 튜토리얼의 운영 환경: Windows 10 시스템,layui 버전 2.5.6 이 방법은 모든 브랜드의 컴퓨터에 적합합니다.

아이디어:

1. 데이터 테이블에 원본 데이터를 저장하려면 적절한 범위의 JS 개체 배열을 만듭니다.

2. 이전 단계에서 생성한 원본 데이터인 JS 객체 배열을 table.render()의 data 매개변수에 할당합니다.

3. 테이블의 모든 데이터를 가져오려면 첫 번째 단계에서 생성한 JS 객체 배열을 직접 가져오면 tableContent에서 데이터를 가져와서 테이블의 모든 데이터를 가져올 수 있습니다.

코드 구현:

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

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

로그인 후 복사

데이터 테이블의 데이터는 table.render()의 done 매개변수를 통해 직접 비동기 요청

을 통해 가져옵니다. 이 매개변수의 값은 데이터가 렌더링된 후의 콜백입니다. 직접 데이터에 대한 할당이든 비동기 요청이든 상관없이 렌더링 후에 콜백이 트리거됩니다. 참고: Laytable의 원본 데이터에 직접 할당 방식을 사용할 경우, 이 방식은 테이블의 모든 데이터를 가져오는 것이 아니라 데이터 테이블의 현재 페이지의 데이터를 가져옵니다. 위의 내용을 따라야 합니다. "데이터 테이블의 데이터는 "직접 할당" 방식입니다

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

로그인 후 복사