MVC project practice, in the three-tier architecture to achieve SportsStore-05, navigation

Source: Internet
Author: User

SportsStore is a master of ASP. the MVC project demonstrated in NET MVC3 framework (Third edition) covers many aspects of MVC, including: use DI container, URL optimization, navigation, paging, shopping cart, order, product management, Image Upload ...... it is a good MVC practice project, but it is not developed under a multi-layer framework, and there is still a distance from the real project. This series will try to implement the SportsStore project in a multi-layer framework and implement some functions in its own way.

 

This is the fifth article in the series, including:

■ 8. Navigation

 

8. Navigation

Create NavController, derived from BaseController:

using System.Collections.Generic;using System.Linq;using System.Web.Mvc;using MySportsStore.IBLL;using Ninject;namespace MySportsStore.WebUI.Controllers{    public class NavController : BaseController    {        [Inject]        public IProductService ProductService { get; set; }        public NavController()        {            this.AddDisposableObject(ProductService);        }        public PartialViewResult Menu(string category = null)        {            ViewBag.SelectedCategory = category;            IEnumerable<string> categories =                ProductService.LoadEntities(p => true).Select(p => p.Category).Distinct().OrderBy(p => p);            return PartialView(categories);        }    }}

Why does the category parameter exist?

To highlight the currently clicked and selected categories. The category track here is:


→ Click the category name in the front-end view and assign the category name to the route variable category.
→ The Menu () method of the Nav controller receives the category, puts it in the ViewBag, and returns it back to the front-end view.
→ When the front-end view traverses all category names, if the current category name is the same as that in ViewBag, a CSS is added for the current category, which is highlighted.


You need to assign a default value to category, because before clicking the category name, category is null.

 

In the Nav/Menu. cshtml partial view, you need to pass the category and page to the Nav () method in the Product controller:

@model IEnumerable<string>@Html.ActionLink("Home","List","Product")@foreach (var link in Model){    @Html.RouteLink(link, new {controller = "Product", action = "List", category = link, page = 1},        new {@class = link == ViewBag.SelectedCategory? "selected" : null})}

The loading category view is displayed in _ Layout. cstml under Views/Shared:

<! DOCTYPE html> 


According to the route parameters passed by clicking "classification", in the Nav method of the Product controller, you also need to consider the category and then filter the set. In addition, if the category name is not clicked, the category is null:

using System.Web.Mvc;using MySportsStore.IBLL;using MySportsStore.WebUI.Models;using Ninject;namespace MySportsStore.WebUI.Controllers{    public class ProductController : BaseController    {        [Inject]        public IProductService ProductService { get; set; }        public ProductController()        {            this.AddDisposableObject(ProductService);        }        public int PageSize = 4;        public ViewResult List(string category, int page = 1)        {            int totalCount = 0;            ProductsListViewModel viewModel = new ProductsListViewModel()            {                Products = ProductService.LoadPageEntities(p => category == null ? true : p.Category == category, p => p.Id, PageSize, page, out  totalCount, true),                PagingInfo = new PagingInfo(){CurrentPage = page, ItemsPerPage = PageSize, TotalItems = category == null ? ProductService.Count(p => true) : ProductService.Count(p => p.Category == category)},                CurrentCategory = category            };            return View(viewModel);        }    }}

The above Code adds the CurrentCategory attribute to the view model ProductsListViewModel. The attribute value is to be handed over to the page:

using System.Collections.Generic;using MySportsStore.Model;namespace MySportsStore.WebUI.Models{    public class ProductsListViewModel    {        public IEnumerable<Product>  Products { get; set; }        public PagingInfo PagingInfo { get; set; }        public string CurrentCategory { get; set; }    }}

In the page section of the Product/List. cshtml view, you need to assign the CurrentCategory value to the routing variable category:

@model MySportsStore.WebUI.Models.ProductsListViewModel@{    ViewBag.Title = "List";    Layout = "~/Views/Shared/_Layout.cshtml";}@foreach (var item in Model.Products){   Html.RenderPartial("PrductSummary", item);}<div class="pager">    @Html.PageLinks(Model.PagingInfo, x => Url.Action("List", new {page = x, category = Model.CurrentCategory}))</div>

Run:

 

To make the URL look better, you need to consider the URL in the following situations:

● When running the hosts page
● When clicking the page
● When you click the navigation category
● Click the category in the navigation bar and then click the page

 

Adjust the URL:

Routes. mapRoute (null, "", // match an empty URL, such as "/" new {controller = "Product", action = "List", category = (string) null, page = 1}); routes. mapRoute (null, "Page {page}", // match "/Page1", when clicking the Page, new {controller = "Product", action = "List ", category = (string) null}, new {page = @ "\ d +"} // The constraint page is a number); routes. mapRoute (null, "{category}", // match "/Soccer", when you click the category in the navigation bar, new {controller = "Product", action = "List ", page = 1}); routes. mapRoute (null, "{category}/Page {page}", // match "/Soccer/Page1", when you click the navigation category, when clicking the page, new {controller = "Product", action = "List"}, new {page = @ "\ d + "});


Run:

 

The series "MVC project practices, implementing SportsStore in a three-tier architecture" includes:

MVC project practice, under the three-tier architecture to achieve SportsStore-01, EF Code First modeling, DAL layer MVC project practice, under the three-tier architecture to achieve SportsStore-02, DbSession layer, BLL layer MVC project practice, in the three-tier architecture to achieve SportsStore-03, Ninject controller factory MVC project practice, in the three-tier architecture to achieve SportsStore-04, achieve paging MVC project practice, in the three-tier architecture to achieve SportsStore-05, implement the MVC project practice of navigation, implement SportsStore-06 under the three-tier architecture, and implement shopping cart

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.