Sportsstore is the MVC project demonstrated in the master ASP. NET MVC3 Framework (third edition), which covers many aspects of MVC, including: Using di containers, URL optimization, navigation, paging, shopping carts, orders, product management, image uploads ... is a good MVC practice project, but the project is not developed in a multi-layered framework, and there is a distance from the real project. This series will attempt to implement the Sportsstore project in a multi-layered framework and implement some functions in its own way.
This article is the fifth in the series, including:
8. Navigation
8. Navigation
Create Navcontroller, derived from Basecontroller:
usingSystem.Collections.Generic;usingSystem.Linq;usingSYSTEM.WEB.MVC;usingMYSPORTSSTORE.IBLL;usingNinject;namespacemysportsstore.webui.controllers{ Public classNavcontroller:basecontroller {[Inject] PublicIproductservice Productservice {Get;Set; } PublicNavcontroller () { This. Adddisposableobject (Productservice); } PublicPartialviewresult Menu (stringCategory =NULL) {viewbag.selectedcategory=category; IEnumerable<string> Categories =productservice.loadentities (P=true). Select (p = = p.category). Distinct (). (P =p); returnPartialview (categories); } }}
Why are there category parameters?
In order to highlight the currently clicked, Selected category. The category trajectory here is:
→ Front view click on the category name and assign the category name to the routing variable category
The menu () method of the →nav controller receives the category, puts it in the viewbag, and returns it back to the front view
→ Front-end view when traversing all classification names, if the current category name is the same as in ViewBag, add a CSS for the current category, highlighting
You need to assign a default value to the category because category is null before clicking on the category name.
In the Nav/menu.cshtml section 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 (varLinkinchModel) {@Html. RouteLink (Link,New{controller ="Product", action ="List", category = link, page =1}, New{@class = link = = viewbag.selectedcategory?"selected":NULL})}
The Load Categories section view is displayed in _layout.cstml under views/shared:
<! DOCTYPE html>"Utf-8"/> <meta name="Viewport"Content="Width=device-width"/> <title> @ViewBag .title</title> <link href="@Url. Content ("~/content/site.css")"Rel="stylesheet"Type="Text/css"/>"Header"> <divclass="title"> Sporting Goods store </div> </div> <div id="Categories">@{html.renderaction ("Menu","Nav");} </div> <div id="content">@RenderBody ()</div>@Scripts. Render ("~/bundles/jquery") @RenderSection ("Scripts", Required:false) </body>
Depending on the routing parameters passed by click Classification, in the product controller's Nav method, you also need to consider the category, and then filter the collection. Also, consider that the category is null when you do not click the navigation category name:
usingSYSTEM.WEB.MVC;usingMYSPORTSSTORE.IBLL;usingMySportsStore.WebUI.Models;usingNinject;namespacemysportsstore.webui.controllers{ Public classProductcontroller:basecontroller {[Inject] PublicIproductservice Productservice {Get;Set; } PublicProductcontroller () { This. Adddisposableobject (Productservice); } Public intPageSize =4; PublicViewResult List (stringCategoryintpage =1) { intTotalCount =0; Productslistviewmodel ViewModel=NewProductslistviewmodel () { Products= Productservice.loadpageentities (p = = Category = =NULL?true: P.category = = Category, p = p.id, PageSize, page, outTotalCount,true), Paginginfo=NewPaginginfo () {currentpage = page, ItemsPerPage = PageSize, TotalItems = Category = =NULL? Productservice.count (p =true): Productservice.count (p = p.category = =category)}, Currentcategory=category}; returnView (ViewModel); } }}
Above, the Currentcategory attribute is added to the view model Productslistviewmodel, and this attribute value is to be given to the paging:
usingSystem.Collections.Generic;usingMysportsstore.model;namespacemysportsstore.webui.models{ Public classProductslistviewmodel { PublicIenumerable<product> Products {Get;Set; } PublicPaginginfo Paginginfo {Get;Set; } Public stringcurrentcategory {Get;Set; } }}
In the pagination 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 (varIteminchmodel.products) {Html.renderpartial ("prductsummary", item);}<divclass="Pager">@Html. Pagelinks (model.paginginfo, x= Url.action ("List",New{page = x, category =model.currentcategory}))</div>
Run:
To make the URL look better, consider the URL in the following scenario:
When you run the default page
When you click on paging
When you click the Navigation category
Click on the Navigation category, then click on the paging
The adjustment URL is:
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 on paging New{controller ="Product", action ="List", category = (string)NULL}, New{page =@"\d+"}//Constrain page to number ); Routes. MapRoute (NULL, "{category}",//Match "/soccer" when clicking on the navigation category New{controller ="Product", action ="List", page =1} ); Routes. MapRoute (NULL, "{category}/page{page}",//Match "/soccer/page1" when clicking on the Navigation category, when clicking on paging New{controller ="Product", action ="List"}, New{page =@"\d+"} );
Run:
"MVC Project Practice, implementing Sportsstore in a three-tier architecture" series includes:
MVC project Practice, in the three-tier architecture implementation of SPORTSSTORE-01,EF Code first modeling, DAL layer and other MVC project practices, in the three-tier architecture implementation of the Sportsstore-02,dbsession layer, the BLL Layer MVC Project Practice, Implementing MVC project practices such as the Sportsstore-03,ninject controller factory in the three-tier architecture, implementing SportsStore-04 under the three-tier architecture, implementing the page-out MVC project practice, implementing SportsStore-05 under the three-tier architecture, Implementation of the Navigation MVC Project practice, the implementation of SportsStore-06 in the three-tier architecture, implementation of the shopping Cart MVC project, implementation of SPORTSSTORE-07 in the three-tier architecture, implementation of the Order Submission MVC Project practice, in the three-tier architecture to achieve SportsStore-08, Deploying to an IIS server