Knockout Hello World Example

by joshjs

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.0.js"></script>
<span data-bind="text: firstName"></span>
<span data-bind="text: lastName"></span>


<button id="change">Change</button>

<div>
    <input data-bind="value: firstName" />
    <input data-bind="value: lastName" />
</div>

JavaScript

function ViewModel(firstName, lastName) {
    this.firstName = new ko.observable(firstName);
    this.lastName = new ko.observable(lastName);
}

var vm = new ViewModel("Josh", "Schultz");

ko.applyBindings(vm);


$("#change").on("click", function() {
    vm.firstName("Joshua");
});