Lauiuiでテーブルデータを取得する方法

layui でテーブルデータを取得する方法: 1. js オブジェクト配列を作成し、元のデータをテーブルに保存します; 2. [table.render()] の data パラメーターをオブジェクト配列に代入します; 3. tableContent のデータを取得するだけです。

このチュートリアルの動作環境: Windows 10 システム、layui バージョン 2.5.6. この方法は、すべてのブランドのコンピューターに適しています。

アイデア:

1. 適切なスコープを持つ JS オブジェクト配列を作成し、元のデータをデータ テーブルに保存します。

2. 前の手順で作成した元データである JS オブジェクト配列を table.render() の data パラメーターに代入します。

3. テーブル内のすべてのデータを取得するには、最初の手順で作成した JS オブジェクト配列を直接取得できます。次のコードを参照して、テーブル内のすべてのデータを取得するには、データを取得します。 tableContent 内。

コード実装:

// 存放数据表格中的数据的对象数组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...
 }
});

データ テーブル内のデータは、非同期リクエストを通じて取得されます。

これは、table.render() の Done パラメーターを通じて直接取得できます。パラメーターの値は、データがレンダリングされた後のコールバックです。直接割り当てであっても、データの非同期リクエストであっても、レンダリングの完了後にコールバックがトリガーされます。注: レイテーブルの元データに直接代入する方法を使用する場合、この方法ではテーブル内のすべてのデータではなく、データ テーブル内の現在のページのデータが取得されます。テーブル内のすべてのデータを取得したい場合は、上記の「データテーブルのデータは「直接割り当て」方式です

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

関連推奨事項:layui

以上がLauiuiでテーブルデータを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。