這篇文章主要介紹layui中怎么獲取表格數(shù)據(jù),文中介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們一定要看完!
創(chuàng)新互聯(lián)是一家業(yè)務(wù)范圍包括IDC托管業(yè)務(wù),虛擬空間、主機租用、主機托管,四川、重慶、廣東電信服務(wù)器租用,服務(wù)器托管,成都網(wǎng)通服務(wù)器托管,成都服務(wù)器租用,業(yè)務(wù)范圍遍及中國大陸、港澳臺以及歐美等多個國家及地區(qū)的互聯(lián)網(wǎng)數(shù)據(jù)服務(wù)公司。layui中獲取表格數(shù)據(jù)的方法:1、創(chuàng)建一個js對象數(shù)組,用來保存表格中的原始數(shù)據(jù);2、為對象數(shù)組賦table.render()的data參數(shù);3、獲取tableContent中的數(shù)據(jù)即可。
環(huán)境:
本文適用于所有品牌的電腦
思路:
1、創(chuàng)建一個作用域合適的JS對象數(shù)組用來保存數(shù)據(jù)表格中的原始數(shù)據(jù)。
2、將上一步創(chuàng)建的JS對象數(shù)組也就是原始數(shù)據(jù)賦給table.render()的data參數(shù)。
3、獲取表格中的所有數(shù)據(jù)其實直接獲取第一步中創(chuàng)建的JS對象數(shù)組即可,參照下面的代碼,獲取表格中的所有數(shù)據(jù)就是獲取tableContent中的數(shù)據(jù)。
代碼實現(xiàn):
// 存放數(shù)據(jù)表格中的數(shù)據(jù)的對象數(shù)組tableContent var tableContent = new Array(); table.render({ elem : '#viewTable', height : 325, even: true, text: { none: '您沒有選中任何字段!' }, // 拿對象數(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 : '序號',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ù)是通過異步請求的方式
直接通過table.render()的done參數(shù)即可獲得,該參數(shù)的值是一個數(shù)據(jù)渲染完的回調(diào),無論是直接賦值還是異步請求數(shù)據(jù),在渲染完之后都會觸發(fā)該回調(diào)。注意:使用直接賦值方式給Laytable原始數(shù)據(jù)時,該方法獲取到的是數(shù)據(jù)表格中當前頁的數(shù)據(jù),并不是表格中的所有數(shù)據(jù),想獲取表格中所有數(shù)據(jù)必須按照上面“數(shù)據(jù)表格中的數(shù)據(jù)是通過直接賦值的方式”的方法
table.render({ //其它參數(shù)在此省略 done: function(res, curr, count){ //如果是異步請求數(shù)據(jù)方式,res即為你接口返回的信息。 //如果是直接賦值的方式,res即為:{data: [], count: 99} data為當前頁數(shù)據(jù)、count為數(shù)據(jù)總長度 console.log(res); //得到當前頁碼 console.log(curr); //得到數(shù)據(jù)總量 console.log(count); } });
以上是“l(fā)ayui中怎么獲取表格數(shù)據(jù)”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對大家有幫助,更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!