asp.net MVC 使用Bootstrap 分页
Boostrap分页控件比较美观,
控制器代码:使用仓储模式实现。如果是直接使用DbContext上下文使用更简单。
public ActionResult Index(int? page,string categoryName,string SearchTitle)
{
var categoryNameList = new List<string>(); //可考虑使用hashSet<>
var categoryQuery = from c in _articleService.FindAll()
select c.Category.CategoryName;
categoryNameList.AddRange(categoryQuery.Distinct());
ViewBag.categoryNameList = new SelectList(categoryNameList, categoryName);
ViewBag.categoryName = categoryName;
ViewBag.SearchTitle = SearchTitle;
int pageNumber = page ?? 1; //如果page 参数没有赋值,默认为1。??空值合并运算符,意思是如果page有值,就为page的值,如果page 为空,值就为1.
ViewBag.page = pageNumber;
int recordPerPage =3; //设置每一页记录数。
ViewBag.recordPerPage = recordPerPage;
int totalRecord = 0; //定义一个输出参数。其实这里给输出参数赋值为0,是没多大意义的。只是为了能够访问到这个变量名而已。输出参数就像引用参数一样,跟形参占用相同的内存空间,形参值改变了,输出参数值也变了。 输出参数是为了解决一个C#中一个函数只能返回一个值的问题,使用它能返回多个值。
IEnumerable<Article> articles;
if (string.IsNullOrEmpty(categoryName))
{
if(string.IsNullOrEmpty(SearchTitle))
articles = _articleService.FindPageList<DateTime>(pageNumber, recordPerPage, out totalRecord, a =>true, OrderType.Desc, a => a.PostTime);
else
articles = _articleService.FindPageList<DateTime>(pageNumber, recordPerPage, out totalRecord, a => a.Title.Contains(SearchTitle), OrderType.Desc, a => a.PostTime);
}
else
{
if (string.IsNullOrEmpty(SearchTitle))
articles = _articleService.FindPageList<DateTime>(pageNumber,recordPerPage,out totalRecord,a=>a.Category.CategoryName == categoryName,OrderType.Desc,a =>a.PostTime);
else
articles = _articleService.FindPageList<DateTime>(pageNumber, recordPerPage, out totalRecord, a => a.Category.CategoryName == categoryName && a.Title.Contains(SearchTitle), OrderType.Desc, a => a.PostTime);
}
ViewBag.totalRecord = totalRecord;
ViewBag.totalPage =(int)Math.Ceiling((double)totalRecord/(double)recordPerPage); //Math.Celling()向上取整函数。 同样,Math.Floor()向下取整函数。
return View(articles.ToList());
}
视图:
@model IEnumerable<MajorConstruction.Models.Article>
@{
ViewBag.Title = "文章列表";
}
<h2>@ViewBag.Title</h2>
@using (Html.BeginForm("Index", "Article", FormMethod.Get, new { @class = "form-inline", role = "form" })) //内联表单,显示在一行上。
{
<label for="categoryName" class="control-label">栏目名称:</label>
<div class="form-group">
@Html.DropDownList("categoryName", ViewBag.categoryNameList as SelectList, "全部栏目", new { @class="form-control"})
</div>
<label for="searchTextbox" class="control-label"> 通过标题查找:</label>
<div class="form-group">
@Html.TextBox("SearchTitle", ViewBag.SearchTitle as string, new { @class = "form-control" })
</div>
<input type="submit" value="查找" class="btn btn-primary" />
}
<table class="table table-striped table-hover">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.Category.CategoryName)
</th>
<th>
@Html.DisplayNameFor(model => model.Title)
</th>
<th>
@Html.DisplayNameFor(model => model.AuthorName)
</th>
<th>
@Html.DisplayNameFor(model => model.PostTime)
</th>
<th>
@Html.DisplayNameFor(model => model.PriorOrder)
</th>
<th>
@Html.DisplayNameFor(model => model.ClickCount)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Category.CategoryName)
</td>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.AuthorName)
</td>
<td>
@Html.DisplayFor(modelItem => item.PostTime)
</td>
<td>
@Html.DisplayFor(modelItem => item.PriorOrder)
</td>
<td>
@Html.DisplayFor(modelItem => item.ClickCount)
</td>
<td>
@Html.ActionLink("编辑", "Edit", new { id = item.ArticleID }) |
@Html.ActionLink("预览", "Details", new { id = item.ArticleID }) |
@Html.ActionLink("删除", "Delete", new { id = item.ArticleID })
</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td class="text-info" colspan="5">
每页 @ViewBag.recordPerPage 条记录,共有 @ViewBag.totalRecord 条记录。 第 @(ViewBag.totalRecord == 0 ? 0 : ViewBag.page) 页 ,共 @ViewBag.totalPage 页 //如果查询到的记录数为0,就显示为第0页。这里有一个条件表达式的目的是为了避免 如 第1页,共0页。的情况。
</td>
</tr>
</tfoot>
</table>
@if (ViewBag.totalRecord != 0) //是为了避免出现没有记录,还是显示下一页的符号链接。
{
<ul class="pagination">
@if (ViewBag.page != 1) //如果当前页面不是第1页,就显示 <<上一页的符号链接。当前页面是第1页,就不显示<<了。
{
<li><a href="@Url.Action("Index", new { categoryName= ViewBag.categoryName,SearchTitle=ViewBag.SearchTitle, page =(int)(ViewBag.page) -1})">«</a></li> //为了保证分页与筛选功能的一致性,所以在链接中增加了路由参数。并将当前值通过ViewBag回传给各个输入表单字段。
}
@for (int page = 1; page <= (int)@ViewBag.totalPage; page++)
{
string activeCss = page == (int)ViewBag.page ? "active" : null;
<li class="@activeCss"><a href="@Url.Action("Index", new { categoryName = ViewBag.categoryName,SearchTitle=ViewBag.SearchTitle, page = page })">@page</a></li>
}
@if (ViewBag.page != ViewBag.totalPage) //如果当前页面不是最后一页了,就显示 >>下一页的符号链接。当前页面是最后一页,就不显示>>了。
{
<li><a href="@Url.Action("Index", new { categoryName = ViewBag.categoryName,SearchTitle=ViewBag.SearchTitle, page = (int)(ViewBag.page) + 1 })">»</a></li>
}
</ul>
}
asp.net MVC 使用Bootstrap 分页的更多相关文章
- ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件
阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...
- [ASP.NET MVC] 使用Bootstrap套件
[ASP.NET MVC] 使用Bootstrap套件 前言 在开发Web项目的时候,除了一些天赋异禀的开发人员之外,大多数的开发人员应该都跟我一样,对于如何建构出「美观」的用户接口而感到困扰.这时除 ...
- ASP.NET MVC利用PagedList分页(二)PagedList+Ajax+JsRender
(原文) 昨天在ASP.NET MVC利用PagedList分页(一)的 最后一节提到,一个好的用户体验绝对不可能是点击下一页后刷新页面,所以今天来说说利用Ajax+PagedList实现无刷新(个人 ...
- asp.net mvc easyui datagrid分页
提到 asp.net mvc 中的分页,很多是在用aspnetpager,和easyui datagrid结合的分页却不多,本文介绍的是利用easyui 中默认的分页控件,实现asp.net mvc分 ...
- 基于ASP.NET MVC和Bootstrap搭建响应式个人博客站(一)
1.0 为什么要做这个博客站? www.zynblog.com 在工作学习中,经常要搜索查找各种各样的资料,每次找到相关资料后都会顺手添加到浏览器书签中,时间一长,书签也就满了.而且下次再点击这个 ...
- ASP.NET MVC利用PagedList分页(一)
前几天看见博客园上有人写ASP.NET MVC的分页思想,这让我不禁想起了PagedList.PagedList是NuGet上提供的一个分页的类库,能对任何IEnumerable<T>进行 ...
- asp.net mvc多条件+分页查询解决方案
开发环境vs2010 css:bootstrap js:jquery bootstrap paginator 原先只是想做个mvc的分页,但是一般的数据展现都需要检索条件,而且是多个条件,所以就变成了 ...
- ASP.NET MVC使用Bootstrap系列(5)——创建ASP.NET MVC Bootstrap Helpers
阅读目录 序言 内置的HTML Helpers 创建自定义的Helpers 使用静态方法创建Helpers 使用扩展方法创建Helpers 创建Fluent Helpers 创建自动闭合的Helper ...
- ASP.NET MVC使用Bootstrap系列(4)——使用JavaScript插件
阅读目录 序言 Data属性 VS 编程API 下拉菜单(dropdown.js) 模态框(modal.js) 标签页(tab.js) 工具提示(tooltip.js) 弹出框(popover.js) ...
随机推荐
- xth 砍树(codevs 1369)
题目描述 Description 在一个凉爽的夏夜,xth 和 rabbit 来到花园里砍树.为啥米要砍树呢?是这样滴,小菜儿的儿子窄森要出生了.Xth这个做伯伯的自然要做点什么.于是他决定带着rab ...
- 找了两个小时的错误,net.sf.json.JSONException: JSON keys cannot be null.
因为数据库里面一条记录插入的是NULL,所以导致报了net.sf.json.JSONException: JSON keys cannot be null,找了半天都找不出来问题所在,其他人又都可以启 ...
- 各种ORM框架对比(理论篇,欢迎来观摩,并且纠正部分错误,防止误区)
各种ORM框架对比 目前框架有以下 PetaPoco Dapper.NET Massive Simple.Data Chain PetaPoco 轻量级,以前单文件,目前有维护形成项目级别,适合多个数 ...
- 动态规划:Ignatius and the Princess IV
#include<stdio.h> #include<string.h> #include<math.h> int main() { _int64 n,a; whi ...
- java构造方法的特点和理解--三只坚果
构造方法的特点:1.首先构造方法是基于类,名字必须与类的名字完全相同(构造方法一般是自己编写的类需要初始化)2.每个类都有一个默认的构造方法,既无参数又无返回值,其作用是使用new操作符创建新对象后初 ...
- 【Nginx】ngx_event_core_module事件模块
功能:创建连接池,决定使用哪些事件驱动机制,以及初始化将要使用的事件模块 该模块定义了ngx_event_core_commands数组处理其感兴趣的7个配置项 ngx_event_conf_t为该模 ...
- VC++中的int main(int argc, char argv[])是什么意思
这是C/C++的一重要函数,叫主函数.无论程序多复杂,代码中必须有这么一个函数,也只能有一个这样的函数:程序执行时就是从这个函数进入的.由于问得比较笼统,如果你想知道详细情况的话,发给你一个网友的求助 ...
- antd 离线 icon
讲你下载下来的官方提供的字体库解压后所有文件复制到node-modules/antd/dist目录下 创建新的文件夹iconfont 在你项目生成的css入口文件对应的源码less文件开始添加如下两句 ...
- 自己定义控件 播放GIF动画
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/ ...
- 爬取指定网页的源代码显示在GUI中
建立一个GUI图形界面用来用来输入网址和代码显示的区域 #encoding=utf-8 __author__ = 'heng' #创建一个可以抓取输入网址源代码的GUI from urllib2 im ...