using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using WebApplication1.Models;//注意引入命名空间
namespace WebApplication1.Controllers
{
public class RoleController : Controller
{
// GET: Role
RbacDBEntities db = new RbacDBEntities();
public ActionResult Index(int pageIndex=1,int pageSize=5,string name="")
{
//总记录数
var counts = db.Roles.Where(p => p.Name.Contains(name)).Count();
var totalPage = Math.Ceiling(counts * 1.00 / pageSize);
//根据页码每页的条数查询
var rows = db.Roles.Where(p => p.Name.Contains(name))
.OrderBy(p => p.ID)
.Skip(pageSize * (pageIndex - 1))//跳过
.Take(pageSize)//取
.ToList();//转化为集合
ViewBag.pageIndex = pageIndex;
ViewBag.pageSize = pageSize;
ViewBag.totalPage = totalPage;
ViewBag.name = name;
return View(rows);
}
}
}
然后根据控制器添加Index视图
@{
ViewBag.Title = "Index";
}
@model List<WebApplication1.Models.Role>
<form>
<br />
<div style="display:flex;justify-content:space-between">
<div class="btn-group">
<input class="btn btn-success" type="button" value="新增" />
<input class="btn btn-danger" type="button" value="删除" />
</div>
<div style="display:flex;">
<input class="form-control" type="text" name="name" id="txtCondName" placeholder="请输入" value="@ViewBag.name" />
<input class="btn btn-primary" type="submit" name="name" id="btnSearch" value="搜索" />
</div>
</div>
<br />
<table class="table table-bordered table-hover">
<thead>
<tr>
<td>编号</td>
<td>名称</td>
<td>备注</td>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>@item.ID</td>
<td>@item.Name</td>
<td>@item.Remark</td>
</tr>
}
</tbody>
</table>
<nav aria-label="Page navigation" style="display:flex;justify-content:space-between">
<ul class="pagination">
<li><a href="#">共
<label>@ViewBag.totalPage</label>
页,第
<input type="text" value="@ViewBag.pageIndex" id="pageIndex" style="width:30px"/>
页,每页显示
<select id="pageSize" onchange="page(1)">
@{
var pageIndexs = new List<int> { 5, 10, 15, 20 };
}
@foreach (var item in pageIndexs)
{
if (@ViewBag.pageSize == @item)
{
<option value="@item" selected="selected">@item</option>
}
else
{
<option value="@item">@item</option>
}
}
</select>
条</a></li>
</ul>
<ul class="pagination">
<li><a href="javascript:page(1);">首页</a></li>
//上一页和下一页需要进行判断,是否为最小的页和最大页,禁用按钮
@if (ViewBag.pageIndex > 1)
{
<li><a href="javascript:page(@ViewBag.pageIndex-1)">上页</a></li>
}
else
{
<li class="disabled"><a href="javascript:page(@ViewBag.pageIndex-1)">上页</a></li>
}
@if (ViewBag.pageIndex < ViewBag.totalPage){
<li><a href="javascript:page(@ViewBag.pageIndex+1);">下页</a></li>
}
else{
<li class="disabled"><a href="javascript:page(@ViewBag.pageIndex+1)">上页</a></li>
}
<li><a href="javascript:page(@ViewBag.totalPage);">末页</a></li>
<li><input type="button" value="go" onclick="go()" /></li>
</ul>
</nav>
</form>
脚本内容:
@section scripts{
<script type="text/javascript">
function page(pageindex) {
var pageSize = $("#pageSize").val();
var name = $("#txtCondName").val();
window.location.href = "/role/index?pageindex=" + pageindex + "&pageSize=" + pageSize+ "&name=" + name
}
function go() {
//获取pageindex
var pageindex = $("#pageIndex").val();
page(pageindex);
}
</script>
}