bootstrapTable如何重新載入資料? 3種方式了解一下!

青灯夜游
發布: 2021-07-29 18:52:48
轉載
6844 人瀏覽過

這篇文章跟大家介紹一下bootstrapTable刷新(重新載入資料)的3種方式。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有幫助。

bootstrapTable如何重新載入資料? 3種方式了解一下!

【相關推薦:《bootstrap教程》】

專案中使用到了bootstrapTable , 根據條件查詢數據,重新載入列表,有幾種方式。

直接看程式碼:

$(function() { load(); }); function load() { $('#dataTable').bootstrapTable( { method : 'post', url : "/user/list", pageSize : 10, pageNumber : 1, sidePagination : "server", queryParams : function(params) { return { limit: params.limit, offset: params.offset, userName: $.trim( $('#userName').val() ) , age: $.trim( $('#age').val() ) , } }, columns : [ { checkbox : true }, { field : 'userName', title : '名称' , }, { field : 'age', title : '年龄' , }, { field : 'createDate', title : '创建时间' , }, { title : '操作', field : 'id', formatter : function(value, row, index) { return '' ; } } ] }); } // 方法1: 刷新(重新加载数据) function reLoad() { $('#dataTable').bootstrapTable('destroy'); load(); } // 方法2: 刷新(重新加载数据) function reLoad2() { $("#dataTable").bootstrapTable('refreshOptions',{pageNumber:1}); // pageNumber:1, 指定页码为第1页 $("#dataTable").bootstrapTable('refresh'); } // 方法3(推荐): 跳转到第1页(包含查询和重新加载) function reLoad3() { $("#dataTable").bootstrapTable('selectPage', 1); }
登入後複製

說明:

方法1、方法2 是將table銷毀銷毀,再產生新的清單;由於table銷毀,使得每次頁面會滾動最上面。

方法3 是跳到第1頁 ,頁面不會捲動,體驗會更好但是當查詢清單資料為空時,方法會失效。

更多程式相關知識,請造訪:程式設計教學! !

以上是bootstrapTable如何重新載入資料? 3種方式了解一下!的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:csdn.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!