在業(yè)務(wù)系統(tǒng)開發(fā)中，對(duì)表格記錄的查詢、分頁、排序等處理是非常常見的，在Web開發(fā)中，可以采用很多功能強(qiáng)大的插件來滿足要求，且能極大的提高開發(fā)效率，本隨筆介紹這個(gè)bootstrap-table是一款非常有名的開源表格插件，在很多項(xiàng)目中廣泛的應(yīng)用。Bootstrap-table插件提供了非常豐富的屬性設(shè)置，可以實(shí)現(xiàn)查詢、分頁、排序、復(fù)選框、設(shè)置顯示列、Card view視圖、主從表顯示、合并列、國際化處理等處理功能，而且該插件同時(shí)也提供了一些不錯(cuò)的擴(kuò)展功能，如移動(dòng)行、移動(dòng)列位置等一些特殊的功能，插件可以用基于HTML5的data-*屬性標(biāo)識(shí)設(shè)置，也可以使用Javascript方式進(jìn)行設(shè)置，非常方便。本篇隨筆介紹bootstrap-table插件在我實(shí)際項(xiàng)目中的應(yīng)用情況，總結(jié)相關(guān)使用中碰到的問題處理經(jīng)驗(yàn)。
1、Bootstrap-table資源及使用介紹
在GitHub上Bootstrap-table的源碼地址是：https://github.com/wenzhixin/bootstrap-table
Bootstrap-table的文檔地址：http://bootstrap-table.wenzhixin.net.cn/
Bootstrap-table的各種樣例：https://github.com/wenzhixin/bootstrap-table-examples
Bootstrap-Table顯示數(shù)據(jù)到表格的方式有兩種，一種是客戶端（client）模式，一種是服務(wù)器（server）模式。
所謂客戶端模式，指的是在服務(wù)器中把要顯示到表格的數(shù)據(jù)一次性加載出來，然后轉(zhuǎn)換成JSON格式傳到要顯示的界面中，客戶端模式較為簡(jiǎn)單，它是把數(shù)據(jù)一次性加載出來放到界面上，然后根據(jù)你設(shè)置的每頁記錄數(shù)，自動(dòng)生成分頁。當(dāng)點(diǎn)擊第二頁時(shí)，會(huì)自動(dòng)加載出數(shù)據(jù)，不會(huì)再向服務(wù)器發(fā)送請(qǐng)求。同時(shí)用戶可以使用其自帶的搜索功能，可以實(shí)現(xiàn)全數(shù)據(jù)搜索。對(duì)于數(shù)據(jù)量較少的時(shí)候，可以使用這個(gè)方法。
所謂服務(wù)器模式，指的是根據(jù)設(shè)定的每頁記錄數(shù)和當(dāng)前要顯示的頁碼，發(fā)送數(shù)據(jù)到服務(wù)器進(jìn)行查詢，然后再顯示到表格中。該方法可以根據(jù)用戶的需要?jiǎng)討B(tài)的加載數(shù)據(jù)，節(jié)省了服務(wù)器的資源，但是不能使用其自帶的全數(shù)據(jù)搜索功能。
Bootstrap-table是基于Boostrap開發(fā)的插件，因此使用的時(shí)候，需要引入Bootstrap的腳本和樣式。
如果我們項(xiàng)目中沒有引入相關(guān)的文件，則需要引入這些樣式和腳本文件，如下所示。
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
重慶分公司
重慶分公司
