數(shù)據(jù)表格中的數(shù)據(jù)是通過(guò)直接賦值的方式。這里實(shí)際上思想是反過(guò)來(lái)的,將拿數(shù)據(jù)表格中的所有數(shù)據(jù),轉(zhuǎn)換為L(zhǎng)ayui數(shù)據(jù)表格拿原始數(shù)據(jù)去渲染數(shù)據(jù)表格。
1、創(chuàng)建一個(gè)作用域合適的JS對(duì)象數(shù)組用來(lái)保存數(shù)據(jù)表格中的原始數(shù)據(jù)。
2、將上一步創(chuàng)建的JS對(duì)象數(shù)組也就是原始數(shù)據(jù)賦給table.render()的data參數(shù)。
3、獲取表格中的所有數(shù)據(jù)其實(shí)直接獲取第一步中創(chuàng)建的JS對(duì)象數(shù)組即可,參照下面的代碼,獲取表格中的所有數(shù)據(jù)就是獲取tableContent中的數(shù)據(jù)。
// 存放數(shù)據(jù)表格中的數(shù)據(jù)的對(duì)象數(shù)組tableContentvar tableContent = new Array();table.render({ elem : '#viewTable', height : 325, even: true, text: { none: '您沒(méi)有選中任何字段!' }, // 拿對(duì)象數(shù)組tableContent中的數(shù)據(jù)作為原始數(shù)據(jù)渲染數(shù)據(jù)表格 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 : '序號(hào)',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... }});數(shù)據(jù)表格中的數(shù)據(jù)是通過(guò)異步請(qǐng)求的方式
直接通過(guò)table.render()的done參數(shù)即可獲得,該參數(shù)的值是一個(gè)數(shù)據(jù)渲染完的回調(diào),無(wú)論是直接賦值還是異步請(qǐng)求數(shù)據(jù),在渲染完之后都會(huì)觸發(fā)該回調(diào)。注意:使用直接賦值方式給Laytable原始數(shù)據(jù)時(shí),該方法獲取到的是數(shù)據(jù)表格中當(dāng)前頁(yè)的數(shù)據(jù),并不是表格中的所有數(shù)據(jù),想獲取表格中所有數(shù)據(jù)必須按照上面“數(shù)據(jù)表格中的數(shù)據(jù)是通過(guò)直接賦值的方式”的方法
table.render({ //其它參數(shù)在此省略 done: function(res, curr, count){ //如果是異步請(qǐng)求數(shù)據(jù)方式,res即為你接口返回的信息。 //如果是直接賦值的方式,res即為:{data: [], count: 99} data為當(dāng)前頁(yè)數(shù)據(jù)、count為數(shù)據(jù)總長(zhǎng)度 console.log(res); //得到當(dāng)前頁(yè)碼 console.log(curr); //得到數(shù)據(jù)總量 console.log(count); }});以上這篇Layui數(shù)據(jù)表格之獲取表格中所有的數(shù)據(jù)方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注