knockout example

by Terrance Smith

HTML

<input type="text" data-bind="text:message" />
<ul>
    <li>
        <label>Name
            <input id="name" data-bind="text:name" type="text" />
        </label>
    </li>
    <li>
        <label>Address
            <input id="address" data-bind="text:address" type="text" />
        </label>
    </li>
    <li>
        <label>City
            <input id="city" data-bind="text:city" type="text" />
        </label>
    </li>
    <li>
        <label>State
            <input id="state" data-bind="text:state" type="text" />
        </label>
    </li>
    <li>
        <label>Phone
            <input id="phone" data-bind="text:phone" type="text" />
        </label>
    </li>
</ul>
<button data-bind="click: validateCarrier">Validate</button>

JavaScript

var CarrierVM = function () {};

CarrierVM.prototype = function () {
    self = this,
    name = ko.observable(""),
    address = ko.observable(""),
    city = ko.observable(""),
    state = ko.observable(""),
    phone = ko.observable(""),
    errorMessage = ko.observable(""),
    validateCarrier = ko.computed(function () {
        alert("");
        var retval = "";
        if (!self.name) {
            retval += "missing name ";
        }
        if (!self.address) {
            retval += "missing address ";
        }
        if (!self.city) {
            retval += "missing city ";
        }
        if (!self.state) {
            retval += "missing name ";
        }
        return retval;
    }, self);
}();

ko.applyBindings(new CarrierVM());