分页采用laypage使用起来比较简单但是功能很齐全，数据库访问使用petapoco，bootstrap用的是flatlab模版，采用mvc的repository模式。
先来一张效果图；
下面来看具体实现；
Controller：
/// 分布视图
///
///
///
Repository
GetList(UserQuery query)
{
var sql = sql.Builder.Append("select Id,UserName,Password,Age,Gender,CreateTime from Users where 1=1 ");
if (!string.IsNullOrWhiteSpace(query.UserName))
{
sql.Append("and username like @0","%" + query.UserName + "%");
}
return Page(query.PageIndex,query.PageSize,sql);
}
js:
添加到对应的div里
$('#datadiv').html(h);
laypage({
cont: 'pager',pages: $('#pagecount').val(),skin: 'molv',skip: true,curr: query.pageindex,jump: function (obj,first) {
if (!first) {
var nquery = $.extend({},{ pageindex: obj.curr });
self.lpage(nquery);
}
}
});
},'html');
},load: function () {
//搜索条件，序列化成对象
var query = users.serializeElements($(':input','#searchdiv'));
query.pageindex = 1;
query.pagesize = 10;
users.lpage(query);
},init: function () {
users.load();
$('#searchbtn').click(function () {
users.load();
});
},serializeElements: function (array) {
var items = {};
array.each(function () {
var fieldname = this.name;
if (fieldname) {
var self = $(this);
if (self.is(':checkBox') || self.is(':radio')) {
if (self.attr('checked'))
items[fieldname] = $(this).val();
} else {
var val = self.val();
if (!self.is(':input')) {
val = val || $.trim(self.text());
}
if (val && val.length === 0) return;
items[fieldname] = val;
}
}
});
return items;
}
}
html:
}