更新时间:2022-06-08 11:04:34 来源:极悦 浏览1332次
极悦小编主要为大家介绍Bootstrap Paginator分页插件使用方法。
首先便是要下载Bootstrap Paginator了,下载地址:Bootstrap Paginator分页插件
首先视图的上面应该需要引入js和css文件,主要有三个文件,分别是bootstrap的css,jquery以及Paginator的js文件。其中网上搜到,貌似jquery必须要1.8版本以上,这个我没有亲自去测试看过。于是视图的文件引用便:
然后,分页的功能当然是一个基于Ajax局部页面刷新才能够吸引我们,当然这个便需要jquery的支持。之前自己搞的都是EasyUI的分页,这次也应该有点不同。
$(function () {
var carId = 1;
$.ajax({
url: "/OA/Setting/GetDate",
datatype: 'json',
type: "Post",
data: "id=" + carId,
success: function (data) {
if (data != null) {
$.each(eval("(" + data + ")").list, function (index, item) { //遍历返回的json
$("#list").append('
$("#list").append('');
$("#list").append('
');
$("#list").append('
Id');
$("#list").append('
部门名称');
$("#list").append('
备注');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
' + item.Id + '');
$("#list").append('
' + item.Name + '');
$("#lwww.cppcns.comist").append('
备注');
$("#list").append('
');
$("#list").append('修改');
$("#list").append('删除');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#liswww.cppcns.com;
$("#list").append('
');
$("#list").append('
');
$("#list").append('
' + item.Id + '');
$("#list").append('
' + item.Name + '');
$("#list").append('
备注');
$("#list").append('
');
$("#list").append('修改');
$("#list").append('删除');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
');
$("#list").append('
内容');
$("#list").append('
' + item.Message + '');
$("#list").append('
');
$("#list").append('
');
});
}
}
});
}
};
$('#example').bootstrapPaginator(options);
}
}
});
})
而在视图的主体部分便有两个div,一个用来呈现数据列表,一个用来放置选择页面的导航。
部门列表
而后台这个GetDate的方法就像下面这样:
public ActionResult GetDate(int id, int? page)
{
int pageIndex = page ?? 1;//当前页
const int pageSize = 2;//这里用来设置每页要展示的数据数量,建议把这个写到web.config中来全局控制
//获取需要展示的部门数据
IEnumerable list = OperateContext.Current.BLLSession.Iqgoa_departmentBLL.GetPagedList(pageIndex, pageSize, x => x.Id!=null, x=>x.Id);
//得到数据的条数
int rowCount = list.Count();
//通过计算,得到分页应该需要分几页,其中不满一页的数据按一页计算
if(rowCount%pageSize!=0)
{
rowCount = rowCount / pageSize + 1;
}
else
{
rowCount = rowCount / pageSize;
}
//转成Json格式
var strResult = "{\"pageCount\":"+rowCount+",\"CurrentPage\":"+pageIndex+",\"list\":" + JsonConvert.SerializeObject(l
这个方法还是有点缺陷的,可以写的更加完美,就好像上面那个pageSize这个可以通过读取配置文件web.config来全局修改,这样管理起来也方便,另外对于页面这种属性:页码,当前页,数据数量等等的信息,可以做一个类来存储,如果网站的项目比较大的话,这样更加方便我们去更改自己的代码。
最后显示的效果如下图:
以上就是关于“Java分页插件的使用方法”介绍,大家如果对此比较感兴趣,想了解更多相关知识,不妨来关注一下极悦的Java视频教程,里面的课程内容从入门到精通,细致全面,通俗易懂,适合没有基础的朋友学习,希望对大家能够有所帮助。
0基础 0学费 15天面授
Java就业班有基础 直达就业
业余时间 高薪转行
Java在职加薪班工作1~3年,加薪神器
工作3~5年,晋升架构
提交申请后,顾问老师会电话与您沟通安排学习