Knockout Testing

by mrrodd

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.1.0.js"></script>
First Name:<input type="text" data-bind="value: firstName" /><br/>
Last Name: <input type="text" data-bind="value: lastName" /><br/>
The name is <span data-bind="text: fullName"></span>

CSS

body {
    font-family: Arial;
    font-size: 0.625em;
}

input {
    font-size: 1.5em;
    width: 5em;
    height: 1em;
}

JavaScript

var viewModel = (function AppViewModel() {
    this.firstName = ko.observable('Bob');
    this.lastName = ko.observable('Smith');
    this.fullName = ko.computed(function() {
        return this.firstName() + " " + this.lastName();
    });
})();

ko.applyBindings(viewModel);