Shulou(Shulou.com)06/03 Report--

This article mainly shows you "what are the common paging problems in Bootstrap-table", which is easy to understand and organized. I hope it can help you solve your doubts. Let me lead you to study and learn what are the common paging problems in Bootstrap-table.

Problem 1: the form value cannot be obtained on the server side. There is no problem with querystring, but request.form cannot get the value.

Solution: this is a problem with ajax, and the original code uses native ajax. 1 can be solved by reading stream files. 2 if you want to use request.form, set contentType: "application/x-www-form-urlencoded"

BootstrapTable ({method: 'post',url: ", height: $(window). Height ()-200 striped: true,dataType:" json ", pagination: true," queryParamsType ":" limit ", singleSelect: false,contentType:" application/x-www-form-urlencoded "

Question 2: set the parameters passed to the server

Methods:

Function queryParams (params) {return {pageSize: params.limit,pageNumber: params.pageNumber,UserName: 4};} $('# tableList'). BootstrapTable ({method: 'post',url: ", height: $(window). Height ()-200 true,dataType:" json ", pagination: true, queryParams: queryParams

Problem 3: pageSize information cannot be obtained at the backend

Resolve:

1. Set it in queryParams

2. In the bootstrap-table.minjs file, modify the source file to "limit" = this.options.queryParamsType&& (e = {limit:e.pageSize,pageNumber:e.pageNumber

It is also possible to modify bootstrap-table.js

If (this.options.queryParamsType = = 'limit') {params = {search: params.searchText,sort: params.sortName,order: params.sortOrder}; if (this.options.pagination) {params.limit = this.options.pageSize;params.pageNumber=this.options.pageNumber,params.offset = this.options.pageSize * (this.options.pageNumber-1);}}

3. Add "queryParamsType": "limit" to the configuration

Complete:

$(document) .ready (function () {$('# tableList'). BootstrapTable ({method: 'post',url: "getcompapylist", height: $(window). Height ()-200 # striped: true,dataType: "json", pagination: true, "queryParamsType": "limit", singleSelect: false,contentType: "application/x-www-form-urlencoded", pageSize: 10 pageNumber1purpura search: false, / / the search box showColumns false is not displayed: / / do not display the drop-down box (select the displayed column) sidePagination: "server", / / server request queryParams: queryParams,//minimunCountColumns: 2 responseHandler: responseHandler,columns: [{field: 'CompanyId',checkbox: true} {field:' qq',title: 'qq',width: 100 center',valign:' middle',sortable: false}, {field: 'companyName',title:' name', width: 100 companyName',title: 'center' Valign: 'middle',sortable: false}]}) }); function responseHandler (res) {if (res.IsOk) {var result = b64.decode (res.ResultValue); var resultStr = $.parseJSON (result); return {"rows": resultStr.Items, "total": resultStr.TotalItems};} else {"rows": [], "total": 0};}} / / passed parameter function queryParams (params) {return {pageSize: params.limit,pageNumber: params.pageNumber,UserName: 4};}

Question 4: the problem of re-searching after paging

Premise: custom search and paging function, such as the function of searching product name.

Phenomenon: return 100 records when searching for inflatable dolls, turn to page 5. At this time, search for massage sticks, there are 200 data, the results should be the first page of the record, but the actual display is still the fifth page of the results. That is, after the re-search, pagenumber has not changed.

Solution: just reset option.

Function search () {$('# tableList'). BootstrapTable ({pageNumber:1,pageSize:10});} these are all the contents of the article "what are the common paging problems in Bootstrap-table?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.