ASP.NET MVC 5 with Bootstrap and Knockout.js

Chapter 16. Lists of Books

This chapter will update the  home page to display a list of featured books. Because the Book model contained both a list price and sale price, a savings label will be added to attract the user into buying the book! Another list of books needs to be displayed filtered to the category selected from the left-hand menu created in Chapter 15. Both the featured books and the filtered-by-category books will leverage a shared view as shown later in this chapter.

The Home Page

Before the books are displayed, I’ve made some minor changes to the home page that was previously scaffolded by Visual Studio. Example 16-1 contains the updated Views/Home/Index.cshtml view with the tweaks.

Example 16-1. Views/Home/Index.cshtml

@{
  ViewBag.Title = "Home Page";
}

<div class="jumbotron">
  <h1>Jamie's Shopping Cart</h1>
  <p class="lead">Shop for your favorite books, we've got the best prices.</p>
  <p><a href="@Url.Action("About")" class="btn btn-primary btn-lg">
      Learn more &raquo;</a></p>
</div>

@Html.Action("Featured", "Books")

The view leverages the stylish jumbotron feature of Bootstrap. This is a great way to create a noticable call-to-action that users cannot miss. My jumbotron is quite simple in that it tells the users I have the best prices, and they can click a link to learn more.

After the jumbotron, the featured books are included via the Html.Action method, just like the cart summary and categories were included in the shared layout. This was done to leverage ...