复制代码 代码如下:
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
复制代码 代码如下:
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Web.Models.PageData<Web.Models.Users>>" %>
复制代码 代码如下:
/// <summary>
/// 分页查询记录集类
/// </summary>
/// <typeparam>通类类型</typeparam>
public class PageData<T>
{
/// <summary>
/// 获取或设置查询返回的分页记录集
/// </summary>
public List<T> GetDate = new List<T>();
/// <summary>
/// 获取或设置符合查询条件总记录数
/// </summary>
public int Count { get; set; }
/// <summary>
/// 每页多少条
/// </summary>
public int PageSize = 5;
/// <summary>
/// 当前多少页
/// </summary>
public int PageIndex { get; set; }
}
经过控制器处理之后返回相关参数,包含分页所需要的显示数据、总记录数、页码、当前第几页信息。因为在List页面中已经定义过类型了,那么调用的时候直接通过Model就可以调用出来。
上图可以看出,GetDate这个属性中保存的是泛型的数据集合,这样我们就可以循环的显示出来。如果分页的话,根据页码传值至控制器,重新获取数据,填充,然后返回,再显示,这里就可以实现显示数据并且分页的功能了。这里稍微介绍下分页的插件,用的是jquery.pagination,如果大家不熟悉使用的话,园子里有详细介绍的文章。
控制器中从数据库中获取相关数据,填充至实体类中,这样视图中直接调用就OK了。这里说写控制器中的写法。
复制代码 代码如下:
$(function () {
//分页参数设置
$("#Pagination").pagination(<%=Model.Count%>, {
callback: pageselectCallback,
prev_text: "« 上一页", //上一页按钮文字
next_text: "下一页 »", //下一页按钮文字
items_per_page: <%=Model.PageSize%>, //每页显示多少条
num_display_entries: 5, //连续分页主体部分显示的分页条目数
current_page: <%=Model.PageIndex%>, //当前多少页
num_edge_entries: 1, //两侧显示的首尾分页的条目数
link_to: "?page=__id__"
});
});
function pageselectCallback(page_id, jq) {
//回调函数
}
复制代码 代码如下:
/// <summary>
/// 用户ID
/// </summary>
public int UID { get; set; }
/// <summary>
/// 登录帐号
/// </summary>
public string UName { get; set; }
/// <summary>
/// 登录密码
/// </summary>
public string UPassWord { get; set; }
复制代码 代码如下:
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Web.Models.Users>" %>
<form action="/Demo/Add/" method="post">
<table>
<tr>
<td>登录帐号:</td>
<td><input type="text" /></td>
</tr>
<tr>
<td>登录密码:</td>
<td><input type="password" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="提交" /></td>
</tr>
</table>
</form>
复制代码 代码如下:
[HttpPost]
//进行添加操作
public ActionResult Add(Users model)
{
//这里可以进行新增操作
//Bll.Add(model);
return RedirectToAction("List");
}
新闻热点
疑难解答
图片精选