Book Image

Knockout.JS Essentials

Book Image

Knockout.JS Essentials

Overview of this book

Table of Contents (16 chapters)
KnockoutJS Essentials
Credits
About the Author
Acknowledgments
About the Reviewers
www.PacktPub.com
Preface
Index

Delegation pattern


When we work with a big amount of data, normal event handling can impact the performance. There is a technique to improve the response time of the events.

When we link the event directly to the item, the browser creates an event for each item. However, we can delegate the event to other elements. Usually, this element can be the document or the parent of the element. In this case, we are going to delegate it to the document that is the event for adding or removing one unit from a product. The problem is that if we just define one event manager for all the products, how do we set the product we are managing? KnockoutJS gives us some useful methods to succeed in this, ko.dataFor and ko.contextFor.

  1. We should update the cart-item.html file's add and remove buttons by adding the add-unit and remove-unit classes respectively:

    <span class="input-group-addon">
      <div class="btn-group-vertical">
        <button class="btn btn-default btn-xs add-unit">
          <i class...