Book Image

KnockoutJS by Example

By : Adnan Jaswal
Book Image

KnockoutJS by Example

By: Adnan Jaswal

Overview of this book

KnockoutJS By Example is a project-based guide that introduces the key features and concepts of knockout.js. It helps you create an application skeleton and a Hello World application. You will develop a To-Do list application that aims to show the basic features of knockout.js in action, such as data binding and observables, following which you will develop a dynamic online customer registration form that captures and validates customer information. This book will further walk you through developing a customer banking portal, which demonstrates the use of knockout.js with components such as navigation bars, tabs, carousels, master details view, panels, forms, and wizards. You will also discover how to use token-based authentication and authorization to secure the customer banking portal, and move on to creating an editable products grid with CRUD operations. Finally, you will explore how to use the Google Maps API with knockout.js. KnockoutJS By Example will not only leave you with a basic understanding of knockout.js fundamentals but also take you through some of the advanced features. It will help you get a web application up and ready instantly.
Table of Contents (17 chapters)
KnockoutJS by Example
Credits
About the Author
Acknowledgment
About the Reviewers
www.PacktPub.com
Preface
Index

Validating the model using Knockout extenders


Knockout provides a way to add additional reusable functionality to the observables through the use of extenders. Knockout extenders could be used to add additional properties to the observable or to intercept and rewrite its value. Extenders could also be used to validate the model. This section will explore and demonstrate the use of extenders for validating the model. The example in this section will apply this method of validation only to the first name field.

An extender is created by adding a method to the ko.extenders object. The method takes two parameters: the observable and an option value. The option value is specified when the observable is extended. The method should return an observable. This can either be the observable itself or a computed observable that manipulates the value of the original observable.

Let's create an extender that will extend the firstName observable in our registration form application and mark it as required...