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

 

 

posted @ 2017-08-31 11:08  sj2016  阅读(2990)  评论(0编辑  收藏  举报