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

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

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

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. npm安装vue-cil出现错误

    这个错误有点尴尬..... 之前全局安装过cil,然后在全局安装出现了这个错误,各种手册看了半天也没有头绪,猛然想起来之前安装过,试下直接初始化项目试一下,果然成功了 然后在 npm install ...

  2. .Net 单例模式(Singleton)

    每台计算机可以有若干个打印机,但只能有一个Printer Spooler, 以避免两个打印作业同时输出到打印机中.每台计算机可以有若干传真卡,但是只应该有一个软件负责管理传真卡,以避免出现两份传真作业 ...

  3. 远程连接windows时剪贴板失效解决方法

    1:打开任务管理器2:找到结束进程rdpclip,找不到可以不管.3:手工新建任务里输入rdpclip,运行即可.

  4. 添加可点击的imagebottom,有个点击动画效果

    android添加可点击的按钮,有个动画切换 ,首先定义一个 res/drawable中定义一个 btn_shutter_background.xml,其定义举例如下: <?xml versio ...

  5. W​i​n​下​h​t​t​p​d​+​p​h​p​+​m​y​s​q​l​环​境​集​成

    apache+php+mysql: php下载:  VC6就是legacy Visual Studio 6 compiler,就是使用这个编译器编译的,  VC9就是the Visual Studio ...

  6. CentOS 7.0 防火墙

    CentOS 7.0默认使用的是firewall作为防火墙,这里改为iptables防火墙.firewall:systemctl start firewalld.service#启动firewalls ...

  7. class 中构造函数与析构函数

    import pymysql class My_sql(): def __init__(self, host, user, passwd, db, port=3306, charset='utf8') ...

  8. Python 文件操作、异常

    windows默认是gbk编码,又称cp936,汉字占2个字节. utf-8被称为万国码,这个编码下,汉字占3个字节. ASCII也是一种编码. 一.文件操作 最基本的文件打开: f = open(& ...

  9. 导出网页中的table到excel

    导出网页中的table到excel的两种简便方法: 1. 纯 JavaScript 方法,缺点只支持IE浏览器 var elTable = document.getElementById(" ...

  10. JavaScript获取地址栏内容

    例如地址为:http://www.mazey.net/baby/blog/index.php?a=1&b=2#c var query = window.location.href; //htt ...