Chapter 15. Implementing the Layout

The shopping cart project is now fully prepared and ready to be implemented. This chapter will implement the two common elements that will be on each page of the site. The first is the menu of book categories, and the second is the cart summary that will allow the users to see a snapshot of what is in their cart.

The Shared Layout

When the shopping cart project was created by Visual Studio, it also created a HomeController (along with the accompanying views) and a shared layout view. Example 15-1 contains an updated Views/Shared/_Layout.cs file that includes the two common elements.

Example 15-1. Shared layout
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>@ViewBag.Title - My ASP.NET Application</title>
  @Styles.Render("~/Content/css")
  @Scripts.Render("~/bundles/modernizr")
</head>
<body>
  <div class="navbar">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" 
                       data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        @Html.ActionLink("Jamie's Shopping Cart", "Index", "Home", 
                     new { area = "" }, new { @class = "navbar-brand" })
      </div>
      <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
          <li>@Html.ActionLink("Home", ...

Get ASP.NET MVC 5 with Bootstrap and Knockout.js now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial