Book Image

KnockoutJS Blueprints

By : Carlo Russo
Book Image

KnockoutJS Blueprints

By: Carlo Russo

Overview of this book

Table of Contents (12 chapters)
KnockoutJS Blueprints
About the Author
About the Reviewers

Adding the Hotel Cards

Now we can develop the Hotel Cards.

As you can see in this wireframe, this component is almost self-contained, so it's normal to realize it with another component.

This component will be much shorter than the previous one because we are not going to put too much effort into it; the main reason is that we get the information to show from the backend, and we just draw it here.

The hardest part here is the HTML and the CSS behind, but we are not so interested in such code in this case.

As the first step, we will create the View Model of this new component, putting this code in BookingOnline/app/components/hotelCard.js:

define(function(require) {
  var ko = require("knockout"),
      template = require("text!./hotelCard.html");

We will use the button binding handler to improve the style of our Booking buttons:

  function HotelCard(data) {
    ko.utils.extend(this, data);

We will then extend this object with the data we get from the parameters...