Bootstrap table学习笔记(2) 前后端分页模糊查询(2)

<div> <div> <form> <div> <div> <label for="search_name">用户姓名:</label> <input type="text" > </div> <div> <label for="search_mobile">手机号:</label> <input type="text" > </div> <div> <label for="search_sex">性别:</label> <select><option value="">---请选择---</option><option value="男">男</option><option value="女">女</option></select> </div> </div> <div> <div> <label for="search_name">用户账号:</label> <input type="text" > </div> <div> <label for="search_name">用户Email:</label> <input type="text" > </div> <div> <input type="button" value="搜索"/> </div> </div> </form> </div> <table ></table> </div>

不论是初始化表格还是搜索的时候传入后台的数据如下:

 pageSize=15   pageNumber=1  username=   name=   sex=   phone=   email=  

返回数据:

我们要返回两个值: rows     total

rows:我们查询到的数据  

total:数据总数(此总数指的是所有数据的总数,并不是单页的数量,比如说我有user表中有100条数据,我的limit 0,15,所以我的rows中有15条数据,但是total=100)

{ "total": 2, "rows": [ { "email": "39385908@qq.com", "id": 1, "name": "邓某某", "password": "", "phone": "12345678911", "rolename": "平台管理员", "sex": "男", "username": "admin" }, { "email": "2222@222.com", "id": 8, "name": "王小二1", "password": "", "phone": "13245678910", "rolename": "", "sex": "男", "username": "admin2" } ] }

有了total总数,加上之前的pageSize以及rows,bootStraptable会为我们自动生成和分页有关的元素:

效果图:

Bootstrap table学习笔记(2) 前后端分页模糊查询

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wysdgs.html