最近在进行一个福分管理系统的项目,遇到很多问题,其中关于EasyUI datagrid控件的分页问题,着实被刺激了一把。
为什么要分页?
当数据量足够大时,如果不分页,第一,可能影响数据加载速度;第二,数据显示内容过多,最终的结果都是影响用户体验。
何为真分页?
按照每页记录的需求条数对数据库进行访问,每次换页都会和数据库进行一次交互。(数据量大时,读取速度的优势显著。)
何为假分页?
一次性从数据库读取所需要的所有数据,根据每页记录的需求条数,进行分页。(适用于总数据量偏小的情况,但是由于现在科技的发达,计算机产业的迅猛发展,只要数据量不是特别大,真假分页的读取速度对用户而言并不是特别明显。)
为什么有这两种形式?孰优孰劣?
需求驱动功能的多样。没有优劣之分,只是需求不同。
真分页
假分页
数据读取速度
快
慢
换页加载速度
较快
快
与数据库交互
多
少
适用情况(总数据量)
多
少
用户体验
好
较好
如何进行真分页?
主要问题在于如何从数据库按照索引值查找相应记录
string sql = "select * from (select ROW_NUMBER() over (order by 字段名 desc) as row,T.* from 表名 T)TT where TT.row between 开始索引值 and 结束索引值";
如何进行假分页?
html
<table id="dg" title="" data-options="
toolbar:'#tb', //数据网格的头部工具栏
rownumbers:true, //显示带有行号的列
autoRowHeight:false,//定义是否设置基于该行内容的行高度
">
</table>
JavaScript
function initTable() {
//datagrid分页-李佳丽-2017年8月23日14:40:16
//把搜索框中的内容提交到后台对数据进行过滤
$('#dg').datagrid({
url: "/QuestManage/LoadPageQuestIndex", //获取数据地址
width: "100%", //宽度
striped: true, //把行条纹化(奇偶行背景色不同)
idField: 'quesID', //标识字段
loadMsg: '正在加载用户的信息.......', //从远程站点加载数据是,显示的提示消息
pagination: true, //数据网格底部显示分页工具栏
singleSelect: false, //只允许选中一行
pageList: [10, 20, 30, 40, 50], //设置每页记录条数的列表
pageSize: 10, //初始化页面尺寸(默认分页大小)
pageNumber: 1, //初始化页面(默认显示第一页)
beforePageText: '第', //页数文本框前显示的汉字
afterPageText: '页 共 {pages} 页',
displayMsg: '第{from}到{to}条,共{total}条',
columns: [[ //每页具体内容
{
field: 'quesID', //列的字段名(数据库)
title: '题目编号', //列的标题文本
editor: 'text', //编辑类型
hidden: true, //隐藏该列
fit: true //自适应宽度
},
{ field: 'quesContent', title: '题目内容', editor: 'text' },
{ field: 'quesScore', title: '题目分值', editor: 'text' },
{ field: 'quesTypeID', title: '所属类别id', editor: 'text', hidden: 'true' },
{ field: 'quesType', title: '所属类别', editor: 'text' },
{ field: 'quesController', title: '所用控件', editor: 'text' },
{ field: 'quesControllerID', title: '所用控件id', editor: 'text', hidden: 'true' },
]]
})
}
controller
#region +List<t_questype> LoadPageQuestIndex初始化所有题目信息
/// <summary>
/// 初始化所有题目信息
/// </summary>
/// <returns>课程信息</returns>
public JsonResult LoadPageQuestIndex()
{
int total = 0;
int pageSize = Request["rows"] == null ? 10 : int.Parse(Request["rows"]);
int pageIndex = Request["page"] == null ? 10 : int.Parse(Request["page"]);
QuestionnaireBLL questionBll = new QuestionnaireBLL();
List<showQuest> quesList = new List<showQuest>();
quesList = questionBll.QueryAllQuestion();
total = quesList.ToList().Count();
quesList = quesList.Skip((pageIndex - 1) * pageSize).Take(pageSize).ToList();
return Json(new
{
rows = quesList,
total,
});
}
#endregion
注:代码可能有所区别,总体思路和方向大致相同,controller的分页代码也可以写在B层或者D层。
小结
不去实践一次怎么说都像是在纸上谈兵,一句话,重在实践。