分页控制器

分页

后台

 public class UserController : Controller
    {
        // GET: User
        RbacDBEntities db = new RbacDBEntities();
        public ActionResult Index(string name="",int roleid=0,int pageIndex=1,int pageSize=10)
        {
            var counts = db.UserInfos.Where(p => p.Name.Contains(name)).Count();
            var totalPage = Math.Ceiling(counts * 1.00 / pageSize);
            var users = db.UserInfos
                .Where(p => (name == "" || p.Name.Contains(name)) &&( roleid==0||p.RoleID==roleid ))
                .OrderBy(p => p.ID)  
                .Skip((pageIndex - 1) * pageSize)   
                .Take(pageSize) 
                .ToList();
            ViewBag.pageIndex = pageIndex;
            ViewBag.pageSize = pageSize;
            ViewBag.Name = name;
            ViewBag.Counts = counts;
            ViewBag.TotalPage = totalPage;
            return View(users);
        }
    }

前端

@{
    ViewBag.Title = "Index";
}

<h2>用户</h2>
@model List<Com.Liangml.ws2.Models.UserInfo>

<form method="post">
    <div>
        <label for="Name">姓名:</label>
        <input type="text" name="Name" class="form-control" />
    </div>
    <div>
        <label for="RoleID">角色:</label>
        <select class="form-control">
            @foreach (var item in Model)
            {
                if (item.RoleID != 0)
                {
                    <option value="@item.RoleID" selected="selected">@item.Role.Name</option>
                }
                else
                {
                    <option value="@item.RoleID">@item.Role.Name</option>
                }
            }
        </select>


    </div>
    <div>
        <input type="submit" class="form-control" value="搜索" />
    </div>
</form>
<table class="table tab-content">
    <thead>
        <tr>
            <th>编号</th>
            <th>姓名</th>
            <th>角色</th>
            <th>账号</th>
            <th>密码</th>
            <th>性别</th>
            <th>爱好</th>
            <th>照片</th>
            <th>备注</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>@item.ID</td>
                <td>@item.Name</td>
                <td>@item.Role.Name</td>
                <td>@item.Account</td>
                <td>@item.Pwd</td>
                <td>
                    @if (item.Sex == true)
                    {
                        @:男
                    }
                    else
                    {
                        @:妖
                    }
                </td>
                <td>@item.Hobby</td>
                <td><img src="~/Content/images/@item.Photo" width="100" height="80" /></td>
                <td>@item.Remark</td>
            </tr>
        }

    </tbody>
</table>
<nav aria-label="Page navigation" style="display:flex;justify-content:space-between">
    <ul class="pagination">
        <li>
            


                <span>
                    共 @ViewBag.TotalPage 页,第
                    <input type="text" id="pageIndex" value="@ViewBag.pageIndex" /> 页
                    ，每页显示


                    <select id="pageSize" onchange="page(1)">
                        @{
                            var pageIndexs = new List<int> { 3, 10, 15, 20, 30 };
                        }
                        @foreach (var item in pageIndexs)
                        {
                            if (@ViewBag.pageSize == @item)
                            {
                                <option value="@item" selected="selected">@item</option>
                            }
                            else
                            {
                                <option value="@item">@item</option>

                            }
                        }
                    </select>
                    条
                    <input type="button" value="go" class="btn-link"  onclick="Go()"/>
                </span>
            
        </li>
    </ul>
    <ul class="pagination">
        <li><a href="javascript:page(1);">首页</a></li>
        <li><a href="javascript:page(@ViewBag.pageIndex-1)">上页</a></li>
        <li><a href="javascript:page(@ViewBag.pageIndex+1)">下页</a></li>
        <li><a href="javascript:page(@ViewBag.TotalPage)">末页</a></li>
        
    </ul>
</nav>
@section scripts{
    <script type="text/javascript">
        function page(pageindex) {
            var pageSize = $("#pageSize").val();
            //var name = $("#Name").val();
            window.location.href = "/user/index?pageindex=" + pageindex + "&pageSize=" + pageSize /*+ "&name=" + name*/
        }
        function Go() {
            var pageIndex = $("#pageIndex").val();
            page(pageIndex);
        }
    </script>

}