Primeiro de tudo, gostaria de agradecer ao autor por resolver as perguntas detalhadas sobre a paginação da mesa de bootstrap e compartilhá -las com você. Espero que este artigo possa ajudá -lo a resolver vários problemas na paginação da tabela de bootstrap. Obrigado pela sua leitura.
Pergunta 1: O servidor não pode obter o valor do formulário, não há problema com o querystring, mas a solicitação.Form não pode obter o valor
Solução: Este é um problema com o Ajax, o código original usa o Ajax nativo. 1 Pode ser resolvido lendo arquivos de fluxo. 2 Se você deseja usar o método request.form, defina contentType: "Application/X-Www-Form-Urlencoded",
como
$ ('#TableList'). Bootstraptable ({Method: 'Post', URL: "", Altura: $ (Window) .Height ()-200, Listrado: True, Datatype: "JSON", Paginação: True, "QueryParamStype": "Limit", SingleSelect: False, contentTye: "Application/Xwwwwwwwwwwwwwwwwwwwww," limite ", singleset: false, contenttype:" Xwwwwwwwwww, "limite":Pergunta 2: Defina os parâmetros passados para o servidor
método:
função queryparams (params) {return {Pagesize: params.limit, pagenumber: params.pagenumber, nome de usuário: 4};} $ ('#tableList'). bootstraptable ({método: 'post', url: ", altura: $ (window) .Height () - 200, ladrão: 'Post', Data:" ", altura: $ (window) .Height () - 200, True: Queryparams,Pergunta 3: As informações do tamanho da PageS não podem ser recuperadas em segundo plano
resolver:
1. Defina -o em queryparams
2. No arquivo bootstrap-table.minjs, modifique o arquivo de origem para "limite" === this.options.QueryParamStype && (e = {limite: e.pagesize, pagenumber: e.pageNumber,
Modificar o bootstrap-table.js também está ok
if (this.options.QueryParamStype === 'LIMIT') {params = {search: params.searchText, classificação: params.sortName, ordem: params.sortorter}; if (this.Options.pagination) {param.limit = this.Options.pagesize; (this.options.pageNumber - 1);}}Configure "QueryParamStype": "Limit",
todo:
<script type = "text/javascript"> $ (document) .ready (function () {$ ('#tableList'). bootstraptable ({método: 'post', url: "getComPappylist", altura: $ (window) .Height () - 200, listrado: true, datatype: "json", truenation, isto ". false,contentType: "application/x-www-form-urlencoded",pageSize: 10,pageNumber:1,search: false, //Do not display the search box showColumns: false, //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,align: 'center',valign: 'middle',sortable: false},{field: 'companyName',title: 'name',width: 100,align: 'center',valign: 'middle',sortable: false}]});});function ResponseHandler (res) {if (res.isok) {var result = B64.Decode (res.ResultValue); var Resultstr = $ .parsejson (res); retornar {"linhas": resultaTr.Items, "Total": Result.TotalItems};} mais {»{" ROWS ": []: sunct.Totalitems};} else {» {" queryparams (params) {return {Pagesize: params.limit, pagenumber: params.pagenumber, nome de usuário: 4};} </sCript>Pergunta 4: pesquisar novamente após a paginação
Pré -requisito: funções de pesquisa e paginação personalizadas, como a função de procurar nomes de produtos.
Fenômeno: Ao procurar bonecas infláveis, retornar 100 registros e recorrer à página 5. Nesse momento, procure por palitos de massagem, existem 200 dados e o resultado deve ser o registro na primeira página, mas a tela real é o resultado na quinta página. Ou seja, depois de pesquisar novamente, o Pagenumber não mudou.
Solução: basta redefinir a opção.
function search () {$ ('#tableList'). Bootstraptable ({pagenumber: 1, PageSize: 10});}Se você ainda deseja estudar em profundidade, pode clicar aqui para estudar e anexar 3 tópicos interessantes a você:
Tutorial de aprendizado de bootstrap
Tutorial prático de bootstrap
Tutorial de uso da tabela de bootstrap
Tutorial de uso de plug-in bootstrap
O exposto acima é tudo sobre este artigo, espero que seja útil para o aprendizado de todos.