路径访问的几种方式和分页效果

显示其它类别的效果和多数据分页效果

默认访问网站路径效果和多数据分页效果

URL路径访问可页面

http://localhost:5339/stationery

http://localhost:5339/stationery/Page2

http://localhost:5339/?category=fashion

http://localhost:5339/?category=stationery

主要还是看代码和书,写出来的代码

主要使用这个路径显示和分页的效果

主要还是根据类别生成菜单显示的方法比较实用,请关注下面代码

关注路由配置

测试数据和数据库表

添加ProductsListViewModel.cs 编写如下代码

namespace Toad.WebUI.Models
{
public class ProductsListViewModel
{ public IEnumerable<Products> Products { get; set; }
public PagingInfo PagingInfo { get; set; }
public string CurrentCategory { get; set; }
}
}

ProductController代码

namespace Toad.WebUI.Controllers
{
public class ProductController : Controller
{
private IProductRepository repository;
public int PageSize = ; public ProductController(IProductRepository productRepository)
{
this.repository = productRepository;
} public ViewResult List(string category, int page = )
{ ProductsListViewModel viewModel = new ProductsListViewModel
{
Products = repository.Products
.Where(p => category == null || p.Category == category)
.OrderBy(p => p.ProductID)
.Skip((page - ) * PageSize)
.Take(PageSize),
PagingInfo = new PagingInfo
{
CurrentPage = page,
ItemsPerPage = PageSize,
TotalItems = category == null ?
repository.Products.Count() :
repository.Products.Where(e => e.Category == category).Count()
},
CurrentCategory = category
};
return View(viewModel);
} ////
//// GET: /Product/
//public ActionResult List()
//{
// return View(repository.Products);
//}
}
}

路由配置代码

namespace Toad.WebUI
{
public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.MapRoute(null,
"",
new
{
controller = "Product",
action = "List",
category = UrlParameter.Optional,
page = UrlParameter.Optional
}
); routes.MapRoute(null,
"Page{page}",
new { controller = "Product", action = "List", category = (string)null },
new { page = @"\d+" }
); routes.MapRoute(null,
"{category}",
new { controller = "Product", action = "List", page = }
); routes.MapRoute(null,
"{category}/Page{page}",
new { controller = "Product", action = "List" },
new { page = @"\d+" }
); routes.MapRoute(null, "{controller}/{action}"); //routes.MapRoute(
// name: "Default",
// url: "{controller}/{action}/{id}",
// defaults: new { controller = "Product", action = "List", id = UrlParameter.Optional }
//); }
}
}

HtmlHelpers/PagingHelpers.cs分页代码

namespace Toad.WebUI.HtmlHelpers
{
public static class PagingHelpers
{
public static MvcHtmlString PageLinks(this HtmlHelper html,
PagingInfo pagingInfo,
Func<int, string> pageUrl)
{ StringBuilder result = new StringBuilder();
for (int i = ; i <= pagingInfo.TotalPages; i++)
{
TagBuilder tag = new TagBuilder("a");
tag.MergeAttribute("href", pageUrl(i));
tag.InnerHtml = i.ToString();
if (i == pagingInfo.CurrentPage)
{
tag.AddCssClass("selected");
tag.AddCssClass("btn-primary");
}
tag.AddCssClass("btn btn-default");
result.Append(tag.ToString());
}
return MvcHtmlString.Create(result.ToString());
}
}
}

Models\PagingInfo.cs代码

namespace Toad.WebUI.Models
{
public class PagingInfo
{
public int TotalItems { get; set; }
public int ItemsPerPage { get; set; }
public int CurrentPage { get; set; } public int TotalPages
{
get { return (int)Math.Ceiling((decimal)TotalItems / ItemsPerPage); }
}
}
}

NavController.cs代码

namespace Toad.WebUI.Controllers
{
public class NavController : Controller
{
private IProductRepository repository; public NavController(IProductRepository repo)
{
repository = repo;
} public PartialViewResult Menu(string category = null)
{ ViewBag.SelectedCategory = category; IEnumerable<string> categories = repository.Products
.Select(x => x.Category)
.Distinct()
.OrderBy(x => x); return PartialView(categories);
}
}
}

视图部分Shared

Menu.cshtml

@model IEnumerable<string>

@Html.ActionLink("Home", "List", "Product", null,
new { @class = "btn btn-block btn-default btn-lg" }) @foreach (var link in Model)
{
@Html.RouteLink(link, new
{
controller = "Product",
action = "List",
category = link,
page =
}, new
{
@class = "btn btn-block btn-default btn-lg"
+ (link == ViewBag.SelectedCategory ? " btn-primary" : "")
})
}

Product视图部分

List.cshtml

@using Toad.WebUI.HtmlHelpers
@model Toad.WebUI.Models.ProductsListViewModel @{
ViewBag.Title = "Products";
Layout = "~/Views/Shared/_Layout.cshtml";
} @foreach (var p in Model.Products)
{
@Html.Partial("ProductSummary", p)
} <div class="btn-group pull-right">
@Html.PageLinks(Model.PagingInfo, x => Url.Action("List",
new { page = x, category = Model.CurrentCategory }))
</div>

视图部分Shared

ProductSummary.cshtml

@model Toad.Domain.EFDB.Products

<div class="well">
<h3>
<strong>@Model.Name</strong>
<span class="pull-right label label-primary">@Model.Price.ToString("c")</span>
</h3> @using (Html.BeginForm("AddToCart", "Cart"))
{
<div class="pull-right">
@Html.HiddenFor(x => x.ProductID)
@Html.Hidden("returnUrl", Request.Url.PathAndQuery)
<input type="submit" class="btn btn-success" value="购买" />
</div>
} <span class="lead"> @Model.Description</span>
</div>

_Layout.cshtml

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/css/site.min.css" rel="stylesheet" /> <title>@ViewBag.Title</title>
</head>
<body>
<div class="row">
<div class="col-md-12">
@Html.Action("Menu", "Nav")
</div>
</div>
<div>
@RenderBody()
</div>
</body>
</html>

代码下载链接: http://pan.baidu.com/s/1eQgjZnO 密码: vdnr

声明:本博客高度重视知识产权保护,发现本博客发布的信息包含有侵犯其著作权的链接内容时,请联系我,我将第一时间做相应处理,联系邮箱ffgign@qq.com

作者:Mark Fan (小念头)    来源:http://cube.cnblogs.com
说明:未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。如有疑问,可以通过 ffgign@qq.com 联系作者,本文章采用 知识共享署名-非商业性使用-相同方式共享 2.5 中国大陆许可协议进行许可

主攻ASP.NET.4.5.1 MVC5.0之重生:根据产品类别显示菜单分类和分页的更多相关文章

  1. 主攻ASP.NET.4.5.1 MVC5.0之重生:空地搭建一个包含 Ninject框架 项目

    1.创建一个空白解决方案 2.添加一个类库 名称为XXX.Domain 3.添加一个ASP.MVC 名称为XXX.WebUI 4.选着空模版,勾选MVC核心引用 5.添加单元测试项目XXX.UntiT ...

  2. 主攻ASP.NET.4.5.1 MVC5.0之重生:政府行政网站常用友情链接跳转javascript[干货分享]

    <!-----------------------------------> <script language="JavaScript" type="t ...

  3. 主攻ASP.NET.4.5.1 MVC5.0之重生:在项目中使用zTree jQuery 树插件

    效果图和json格式 Controllers代码 using HR.Models; using HR.Models.Repository; /***************************** ...

  4. 主攻ASP.NET.4.5.1 MVC5.0之重生:创建UIHelper通用自定义分页和选择开关与PagesHelper和IsSelect简单用法

    @helper放入地方 分页效果 选择开关编辑调用 <dl> <dd class="dc1">是否主管:</dd> <dd> @UI ...

  5. 主攻ASP.NET.4.5.1 MVC5.0之重生:系统角色与权限(二)

    系统角色篇 数据结构 用户管理 Controller代码 public class SystemUserController : Controller { //public void Log() // ...

  6. 主攻ASP.NET.4.5.1 MVC5.0之重生:系统角色与权限(一)

    数据结构 权限分配 1.在项目中新建文件夹Helpers 2.在HR.Helpers文件夹下添加EnumMoudle.Cs namespace HR.Helpers { public enum Enu ...

  7. 主攻ASP.NET.4.5.1 MVC5.0之重生:Web项目语音朗读网页文本,简单语音提示浏览状态

    第一步 添加SpeechLib.dll 下载SpeechLib.dll: 在项目中并且引用DLL using SpeechLib; using System.Threading; 第二步 调用并使用 ...

  8. 主攻ASP.NET MVC4.0之重生:ASP.NET MVC使用JSONP

    原文:主攻ASP.NET MVC4.0之重生:ASP.NET MVC使用JSONP 原文地址 http://www.codeguru.com/csharp/.net/net_asp/using-jso ...

  9. IoC实践--用Autofac实现MVC5.0的IoC控制反转方法

    Autofac是一个.net平台下发性能还不错的IoC框架,利用它可以实现依赖注入和控制反转,使自己的软件模块之间的耦合性大大降低,让软件扩展.维护更加容易.控制反转(Inversion of Con ...

随机推荐

  1. js或jquery实现页面打印(局部打印)

    首先定义css样式:  复制代码代码如下: @media print { .noprint { display: none;color:green } }  对于不想打印的内容只用在标签中加上 cla ...

  2. 基于HTML5 audio元素播放声音jQuery小插件

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1609 一.前面的些唠 ...

  3. centos7 更换yum源为阿里云

    mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.backup curl -o /etc/yum.repos ...

  4. mysql增加自定义函数功能

    mysql默认是不能自定义函数的 当create function时 This function has none of DETERMINISTIC, NO SQL, or READS SQL DAT ...

  5. 绝对定位position: absolute;

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Android无线测试之—UiAutomator UiSelector API介绍之七

    对象搜索—索引与实例 一.索引与实例说明: 1)index:在同一级中的编号,在兄弟类中组件的编号,index从0开始 2)instance:同一个布局中同一类组件的编号,instance从0开始 二 ...

  7. eclipse中如何查看一个android模拟器的内部文件

    eclipse中如何查看一个android模拟器的内部文件,有时要在其中添加一个文件夹或是什么的,要手动的做这件事,而不能够用代码去完成时,就要用这个方法了. 1.首先,打开一个安卓模拟器. 2.这个 ...

  8. IOS7 UI Transition Guide 状态栏 statusbar

    本文转载至 http://blog.csdn.net/linzhiji/article/details/12233387 Redesign Your App for iOS 7 之 页面布局 iOS7 ...

  9. 巨蟒django之权限8:排序&&菜单展开权限归属

    1.权限控制的流程+表结构 内容回顾: wsgi:socket进行收发消息 中间件:(超级重点的面试题)在全局范围内控制django的输入和输出的一个钩子,处理输入和输出说白了就是处理请求和响应req ...

  10. js特殊字符过滤

    //匹配中文 数字 字母 下划线 var checkInput = function (str) { var pattern =var pattern = /^[\w\u4e00-\u9fa5]+$/ ...