What is knockoutjs?


Knockout is a fast, extensible and simple JavaScript library designed to work with HTML document elements using a clean underlying view model. It helps to create rich and responsive user interfaces. Any section of UI that should update dynamically (e.g., changing depending on the user’s actions or when an external data source changes) with Knockout can be handled more simply and in a maintainable fashion.

Knockout has no dependencies. It works without jQuery, Prototype.js, or any other JavaScript library, and it is compatible with all popular web browsers, such as Chrome, Firefox, Safari, Internet Explorer and Opera.

Knockout provides great documentation, amazing real-time tutorials and many live examples with source code. As compared to any other JavaScript engine or framework such as BackBone, JavaScript MVC, Ember or Angular, Knockout is a lightweight library while most of the others are frameworks. That’s why Knockout usually is faster (it depends on OS and browser). While most other JavaScript frameworks can bind to an entire HTML document, Knockout can bind to a specific DOM container instead of applying bindings globally.

Working with Knockout consists of several steps:

  • Get data model. In most cases, data will be returned from the remote server in JSON format with AJAX (Asynchronous JavaScript and XML) call. In the example below, our data will be stored in the static JavaScript object (demo.data-mock.js file).
  • Create View. View is a HTML template with Knockout bindings, using “data-bind” attributes. It can contain grids, divs, links, forms, buttons, images and other HTML elements for displaying and editing data.
  • Create View Model. View model is a pure-code representation of the data operations on a UI. It can have usual properties and observable properties. An observable property means that when it’s changed in the view model, it will automatically be updated in the UI.
  • Map data from data model to view model. In most cases, data in the data model are independent from UI and don’t have a concept of observables. In this step a map from the data model to the view model should be created. It can be done manually or using Knockout mapping plugin.
  • Bind view model to the view. When view model is initialized, it can be bound to part of the HTML document, or the whole HTML document.




Please download the knockout js from Download knockout js  or include the link


in script src.

Share This:

Leave a Reply

Your email address will not be published. Required fields are marked *