bootstrap table 服务端分页
前端js
$(function () { //$('#MDTable').bootstrapTable('destroy'); $("#MDTable").bootstrapTable({ //'destroy' 是必须要加的==作用是加载服务器数据,初始化表格的内容Destroy the bootstrap table. toolbar: '#toolbar', //工具按钮用哪个容器 method: 'get', url: "/MD_All/MD_Data", contentType: "application/x-www-form-urlencoded", dataType: "json", pagination: true, //是否显示分页(*) striped: true,//隔行换色 sidePagination: 'server',//分页方式 pageNumber: 1,//初始化table时显示的页码 pageSize: 5,//每页条目 pageList: [5, 10, 20, 50, 100], //queryParams: queryParams, locale: 'zh-CN', sortable: true,//排序 showColumns: true,//是否显示 内容列下拉框 clickToSelect: true,//点击选中checkbox singleSelect: true,//启用单行选中 showExport: true, //是否显示导出 exportDataType: "all", //basic', 'all', 'selected'. queryParamsType: "", //默认值为 'limit' ,在默认情况下 传给服务端的参数为:offset,limit,sort // 设置为 '' 在这种情况下传给服务器的参数为:pageSize,pageNumber queryParams: function queryParams(params) { //设置查询参数 var param = { pageNumber: params.pageNumber, pageSize: params.pageSize, }; return param; }, columns: [ { field: 'MaterialID', title: '物料号' }, { field: 'OldMaterialID', title: '旧物料号' }, { field: 'IndustryFeild', title: '行业领域' }] }); });
后端
public ActionResult MD_Data() { try {int pageSize = Request["pageSize"] == null ? 2 : int.Parse(Request["pageSize"]); int pageNumber = Request["pageNumber"] == null ? 1 : int.Parse(Request["pageNumber"]); var list = _unitOfWork.MD_All.Get(); List<MD_All> lst = new List<MD_All>(); var array = list.ToArray(); for (int i = (pageNumber - 1) * pageSize; i < pageNumber * pageSize && i < array.Length; i++) { lst.Add(array[i]); } int total = list.Count();
//这里需要返回给前端总数和列表信息 需要把json组合下 JsonObj obj = new JsonObj() { rows = lst, total = total }; return Json(obj, JsonRequestBehavior.AllowGet); } catch (Exception ex) { //获取信息出错 return Json("false"); } }
这是要组合的json格式
public class JsonObj { public List<MD_All> rows { get; set; } public int total { get; set; } }
分页问题汇总
http://www.jb51.net/article/85373.htm
参考文章
http://blog.csdn.net/lzx_longyou/article/details/50563907
http://blog.csdn.net/cslp517/article/details/50505445
http://blog.csdn.net/u013425609/article/details/51435731
http://blog.csdn.net/hanxue_tyc/article/details/54917227
表格参数
http://blog.csdn.net/rickiyeat/article/details/56483577
二、筛选条件后的table数据也是进行了分页处理,但是点击第二页时,筛选条件并未传入后端
queryParams: function queryParams(params) { //设置查询参数 var param = { pageNumber: params.pageNumber, pageSize: params.pageSize, MaterialID: $("#MaterialID").val(), Factory: $("#Factory").val(), MaterialType: $("#MaterialType").val(), LogStartDate: $("#LogStartDate").val(), LogEndDate: $("#LogEndDate").val(), FileName: $("#FileName").val(), Status: $("#Status").val() }; return param; },
在分页传入的params中加入筛选的条件,后端即可获得数据,筛选条件分页OK
参考
https://www.cnblogs.com/ziyoublog/p/9055790.html