转:MVC分页
原文地址:http://www.cnblogs.com/iamlilinfeng/p/4075292.html
分页总是搞得我很烦,也是因为刚接触,貌似有好多插件,之前在用一个,可是后来发现一翻页原来的筛选项就提交不上了,然后就换了这个,其实这篇文章对我而言最起作用的还是View文件中BeginForm中的参数
new RouteValueDictionary { { "id", "" } },也许原来的分页方式加上这个参数也是可以的,还没尝试。
前言
前几天在博客上挂了个群链接,就是上面的链接,从博客上进群不少网友,从上一段教程来看,mvc入门问题集中在了以下两个部分“Contrl与View数据传递(多表数据)”和数据分页。因此,今天晚上熬夜写了个小Demo以帮助更多的初学者快速入门,由于时间仓促,有不明白的地方请加群咨询,甭管会不会,有问必答。觉得有帮助别忘了点个赞哈
目录
一、Contrl与View数据传递(多表数据)
二、分页控件介绍
三、MVC源码说明
四、源码下载
五、mvc入门教程目录
一、Contrl与View数据传递(多表数据)
园子也是用mvc来写的,我们用园子的首页举个例子。

上图我只切了园子首页的一部分,如图所示,共分为4块内容。而这4块内容可能来自于不同的数据表,假设:第一、二块内容来自Blog表、第三、四块内容来自AD表。此时MVC一般有两种方式进行Control与View的交互。
1)ViewBag变量方式
使用4个ViewBag变量进行数据传递,Data1、Data2、Data3、Data4的数据直接从数据库里调。
Control中伪代码如下所示:

1 public ActionResult CnBlogIndex()
2 {
3 ViewBag.Data1 = Data1;
4 ViewBag.Data2 = Data2;
5 ViewBag.Data3 = Data3;
6 ViewBag.Data4 = Data4;
7 return View();
8 }

View中伪代码如下所示:

1 //第一块内容
2 @foreach (Data1 data in (ViewBag.Data1 as IEnumerable<Data1>))
3 {
4 <tr>
5 <td>@Html.DisplayFor(model => data.ID)</td>
6 </tr>
7 }
8 //第二块内容
9 @foreach (Data2 dat1 in (ViewBag.Data2 as IEnumerable<Data2>))
10 {
11 <tr>
12 <td>@Html.DisplayFor(model => data.ID)</td>
13 </tr>
14 }
15 //第三块内容
16 @foreach (Data3 data in (ViewBag.Data3 as IEnumerable<Data3>))
17 {
18 <tr>
19 <td>@Html.DisplayFor(model => data.ID)</td>
20 </tr>
21 }
22 //第四块内容
23 @foreach (Data4 data in (ViewBag.Data4 as IEnumerable<Data4>))
24 {
25 <tr>
26 <td>@Html.DisplayFor(model => data.ID)</td>
27 </tr>
28 }

2)ViewModel方式(推荐)
什么是ViewModel?ViewModel就是针对视图做的Model,让Model更加适合于View。Data1、Data2、Data3、Data4的数据直接从数据库里取出,然后组装给ViewModel,ViewModel做为整个页面的数据载体进行数据传递:
ViewModel中的伪代码如下所示:
1 public class CnBlogIndex {
2 List<Data> Data1 { get; set; }
3 List<Data> Data2 { get; set; }
4 List<Data> Data3 { get; set; }
5 List<Data> Data4 { get; set; }
6 }
Control中伪代码如下所示:

public ActionResult CnBlogIndex()
{
ViewModel.CnBlogIndex CnBlogIndex = new ViewModel.CnBlogIndex();
CnBlogIndex.Data1 = Data1;
CnBlogIndex.Data2 = Data2;
CnBlogIndex.Data3 = Data3;
CnBlogIndex.Data4 = Data4;
return View(CnBlogIndex);
}

View中伪代码如下所示:

1 @model CnBlogIndex
2 @foreach (var info in Model.Data1)
3 {
4 <tr>
5 <td>info.**</td>
6 </tr>
7 }
8 @foreach (var info in Model.Data2)
9 {
10 <tr>
11 <td>info.**</td>
12 </tr>
13 }
14 @foreach (var info in Model.Data3)
15 {
16 <tr>
17 <td>info.**</td>
18 </tr>
19 }
20 @foreach (var info in Model.Data4)
21 {
22 <tr>
23 <td>info.**</td>
24 </tr>
25 }

两种传递数据的方式都可以完成我们的正常工作,但个人更推荐使用ViewModel将一个页面的信息进行聚合,这样虽然多了一些工作量,但可以使整体结构更清晰,同进也更易于维护。
二、分页控件介绍
很多朋友在刚接触mvc的时候都喜欢自己写分页,此处推荐使用开源分页控件“MvcPager”,相信大家在使用webform的时候大多使用的分页控件都是aspnetpager(Webdiyer出品),这个mvc分页控件也是Webdiyer出品(很好很强大),官方博客:http://www.webdiyer.com/,我在前面的教程中也提到过这个分页控件,但群友们反应我前面的教程分页控件带有查询条件时,翻页后条件消失。因此,在些我对分页控件再次进行讲解,并加上查询条件。
效果如下图所示:

查询条件使用文本框,并且使用参数的形式在view与control中进行传输。这里只是使用了mvcpager的一种方式(get查询方式),mvcpager有各种分页的方式,如ajax分页等。有兴趣的可以下载代码研究下,官方地址如下:http://www.webdiyer.com/mvcpager/
ViewModel中的代码如下:

1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using Webdiyer.WebControls.Mvc;
6
7 namespace MvcApplication.Models.Home
8 {
9 public class Index
10 {
11 public string BlogURL { get; set; }
12 //当前用户
13 public Model.User User { get; set; }
14 //信息列表
15 public PagedList<Model.Info> Infos { get; set; }
16 }
17 }

Control中的代码如下:

1 public ActionResult Index(int? id = 1, string title = null)
2 {
3 //用户
4 Model.User User = new Model.User();
5 User.UserID = 1;
6 User.UserName = "mvc技术交流(群号:384185065)";
7 //信息列表(此处使用分页控件提出数据)
8 int totalCount = 0;
9 int pageIndex = id ?? 1;
10 int pageSize = 2;
11 PagedList<Model.Info> InfoPager = DAL.Info.GetInfos(title, pageSize, (pageIndex - 1) * 2, out totalCount).AsQueryable().ToPagedList(pageIndex, pageSize);
12 InfoPager.TotalItemCount = totalCount;
13 InfoPager.CurrentPageIndex = (int)(id ?? 1);
14 //数据组装到viewModel
15 Models.Home.Index index = new Models.Home.Index();
16 index.BlogURL = "http://www.cnblogs.com/iamlilinfeng/archive/2013/04/01/2992432.html";
17 index.User = User;
18 index.Infos = InfoPager;
19 //------------------使用ViewBig变量传递数据---------------//
20 //ViewBag.PagerData = InfoPager;
21 return View(index);
22 }

View中的代码如下:

1 @model MvcApplication.Models.Home.Index
2 @using Webdiyer.WebControls.Mvc;
3 <title>MVC入门教程</title>
4
5 @*----------------------------------ViewModel中的博客地址,mvc入门教程博客地址:http://www.cnblogs.com/iamlilinfeng/archive/2013/04/01/2992432.html-----------------------*@
6 @Html.Label("博客地址:") @Model.BlogURL
7 <br />
8 @Html.Raw("--------------------------------------------------------------------------------------------------------------------------------------------------------------------")
9 <br />
10
11 @*----------------------------------ViewModel用户实体信息-----------------------*@
12 @Html.LabelFor(model => model.User.UserID) @Html.Raw(":") @Model.User.UserID
13 <br />
14 @Html.LabelFor(model => model.User.UserName) @Html.Raw(":") @Model.User.UserName
15 <br />
16
17 @*----------------------------------ViewModel数据信息分页-----------------------*@
18 @Html.Raw("--------------------------------------------------------------------------------------------------------------------------------------------------------------------")
19 <br />
20 @using (Html.BeginForm("Index", "Home", new RouteValueDictionary { { "id", "" } }, FormMethod.Get))
21 {
22 @Html.Label("查询条件(标题):") <input name="title" value="@Request.QueryString["title"]" /><input type="submit" value="查询" />
23 }
24 <table>
25 <tr>
26 <th>编号</th>
27 <th>标题</th>
28 <th>内容</th>
29 </tr>
30 @foreach (var info in Model.Infos)
31 {
32 <tr>
33 <td>@Html.DisplayFor(model => info.InfoID)</td>
34 <td>@Html.DisplayFor(model => info.Title)</td>
35 <td>@Html.DisplayFor(model => info.Content)</td>
36 </tr>
37 }
38 @*----------------------------------使用ViewBig变量传递数据-----------------------*@
39 @*@foreach (Model.Info info in (ViewBag.PagerData as IEnumerable<Model.Info>))
40 {
41 <tr>
42 <td>@Html.DisplayFor(model => info.InfoID)</td>
43 <td>@Html.DisplayFor(model => info.Title)</td>
44 <td>@Html.DisplayFor(model => info.Content)</td>
45 </tr>
46 }*@
47 </table>
48 @Html.Pager(Model.Infos, new PagerOptions
49 {
50 PageIndexParameterName = "id",
51 ShowPageIndexBox = true,
52 FirstPageText = "首页",
53 PrevPageText = "上一页",
54 NextPageText = "下一页",
55 LastPageText = "末页",
56 PageIndexBoxType = PageIndexBoxType.TextBox,
57 PageIndexBoxWrapperFormatString = "请输入页数{0}",
58 GoButtonText = "转到"
59 })
60 @Html.Raw("共:") @Model.Infos.TotalItemCount @Html.Raw("页,")
61 @Model.Infos.CurrentPageIndex @Html.Raw("/") @Model.Infos.TotalPageCount @Html.Raw("页")

三、MVC源码说明

开发环境:vs2013,mvc4。解决方案共分为3个项目。MvcApplication为mvc展示层,Model为数据实体与数据库一一对应,DAL链接数据进行数据的存取。
1,MvcApplication--Models--Index,为针对View中的Index的ViewModel,用于组装Index所需要的所有数据
2,Model--Info,为信息实体,对应信息表。用于讲解分页数据
3,DAL--Sqlcommon,调用分页存储过程的类。
View中展示的数据是由:User、List<Info>共同来提供的,有了这个示例后,再多的数据都可以通过该方式进行组装。
四、源码下载
五、mvc入门教程目录
8.无废话MVC入门教程八[MvcPager分页控件的使用]
转:MVC分页的更多相关文章
- MVC分页
http://www.cnblogs.com/iamlilinfeng/p/4075292.html 目录 一.Contrl与View数据传递(多表数据) 二.分页控件介绍 三.MVC源码说明 四.源 ...
- ASP.NET MVC分页组件MvcPager 2.0版发布暨网站全新改版
MvcPager分页控件是在ASP.NET MVC Web应用程序中实现分页功能的一系列扩展方法,该分页控件的最初的实现方法借鉴了网上流行的部分源代码, 尤其是ScottGu的PagedList< ...
- ASP.NET MVC 4使用PagedList.Mvc分页
ASP.NET MVC中进行分页的方式有多种,在NuGet上有提供使用PagedList.PagedList.Mvc进行分页. 1. 通过NuGet引用PagedList.Mvc 在安装引用Paged ...
- ASP.NET MVC分页实现之改进版-增加同一个视图可设置多个分页
我之前就已经实现了ASP.NET MVC分页(查看该博文),但它有局限性,必须确保在同一个视图中只能有一处分页,若需要在同一个视图中设置多个分页,却无能为力,为此,我重新对原先的代码进行了优化,增加了 ...
- Mvc 分页栏扩展方法
using System; using System.Collections.Generic; using System.Reflection; using System.Text; using Sy ...
- spring mvc 分页
spring mvc 分页
- 基于Bootstrap的Asp.net Mvc 分页
基于Bootstrap的Asp.net Mvc 分页的实现 最近写了一个mvc 的 分页,样式是基于 bootstrap 的 ,提供查询条件,不过可以自己写样式根据个人的喜好,以此分享一下.首先新建一 ...
- Mvc分页组件MvcSimplePager代码重构
1 Mvc分页组件MvcSimplePager代码重构 1.1 Intro 1.2 MvcSimplePager 代码优化 1.3 MvcSimplePager 使用 1.4 End Mvc分页组件M ...
- Mvc分页组件MvcSimplePager代码重构及使用
1 Mvc分页组件MvcSimplePager代码重构 1.1 Intro 1.2 MvcSimplePager 代码优化 1.3 MvcSimplePager 使用 1.4 End Mvc分页组件M ...
随机推荐
- 特征提取(Detect)、特征描述(Descriptor)、特征匹配(Match)的通俗解释
特征匹配(Feature Match)是计算机视觉中很多应用的基础,比如说图像配准,摄像机跟踪,三维重建,物体识别,人脸识别,所以花一些时间去深入理解这个概念是不为过的.本文希望通过一种通俗易懂的方式 ...
- 关于bootstrap--列表(ol、ul)
1.list-unstyled : 在<ol>(有序列表)</ol><ul>(无序列表)</ul>中加入class="list-styled& ...
- css中的段落样式及背景
一.段落样式 css中关于段落的样式主要有行高,缩进,段落对齐,文字间距,文字溢出,段落换行等.它们的具体语法如下: line-height : normal | length text-indent ...
- [RxJS] Reactive Programming - Rendering on the DOM with RxJS
<!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery- ...
- [Redux] Generating Containers with connect() from React Redux (VisibleTodoList)
Learn how to use the that comes with React Redux instead of the hand-rolled implementation from the ...
- Eclipse创建java webproject配置Tomacat和JDK
在学习AJAX过程中.还用Intellij就有点老旧了,这是后装个Eclipse时,发现这个配置也非常头疼.如今就叫你怎样创建一个webproject,同一时候叫你配置Eclipse. 一.创建一个w ...
- linux 服务器更主板后无法识别网卡处理过程
linux 服务器更主板后无法识别网卡处理过程 服务器故障报修,主板坏,更换主板后无法识别网卡,ifconfig 查看只显示:lo loopback 127.0.0.1. 系统加载网卡驱动后会去读 ...
- HTML页面之间跳转与传值(JS代码)
跳转的方法如下: 方法一: window.location.href = "b.html"; 方法二(返回上一个页面,这个应该不算,先放在这): window.history.ba ...
- 自定义HttpHandler
1.创建自定义类型 2.继承IHttpHandler接口,并实现 3.配置Web.Config文件,注册类型 4.访问 public class QuickMsgSatisticsHandler : ...
- ubuntu中安装Docker
系统要求: 必须时64位的系统,内核最低要求是3.10 查看系统内核: $ uname -r 3.11.0-15-generic 获取最新版本打Docker: $ wget -qO- https:// ...