Kendo UI Base

HTML

<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div id="custEdit">
    <form role="form">
        <div class="form-group">
            <label>Customer Name: <input class="form-control" data-bind="value: name" /></label>
        </div>
        <div class="form-group">
            <label>Address 1: <input class="form-control" data-bind="value: address1" /></label>
        </div>
        <div class="form-group">
            <label>Address 2: <input class="form-control" data-bind="value: address2" /></label>
        </div>
        <div class="form-group">
            <label>City: <input class="form-control" data-bind="value: city" /></label>
        </div>
        <div class="form-group">
            <label>State: <input class="form-control" data-bind="value: state" /></label>
        </div>
        <div class="form-group">
            <label>Zip: <input class="form-control" data-bind="value: zip" /></label>
        </div>
        <button class="k-button" data-bind="click: update">Update</button>
        <button class="k-button" data-bind="click: reset">Reset to Defaults</button>
        <div data-bind="visible: updated">
            <h4>Customer Updated!</h4>
        </div>
    </form>
</div>

CSS

form {
    padding: 1%;
}

JavaScript

var storage = {
    save: function(cust) {
        localStorage.setItem("cust", JSON.stringify(cust));
    },
    load: function() {
        var cust = localStorage.getItem("cust");
        return cust ? JSON.parse(cust) : {}; 
    }
};

var CustomerEditViewModel = function(defaults) {
    return kendo.observable($.extend({
        updated  : false,
        update: function (e) {
            e.preventDefault();
            this.set("updated", true);
            // optional - add a line here overwriting the
            // original defaults value with what's being
            // saved so the Reset To Defaults only resets
            // to the most recently saved data.
            storage.save({
                name     : this.get("name"),
                address1 : this.get("address1"),
                address2 : this.get("address2"),
                city     : this.get("city"),
                state    : this.get("state"),
                zip      : this.get("zip")
            });
        },
        reset: function (e) {
            e.preventDefault();
            this.set("name", defaults.name);
            this.set("address1", defaults.address1);
            this.set("address2", defaults.address2);
            this.set("city", defaults.city);
            this.set("state", defaults.state);
            this.set("zip", defaults.zip);
            this.set("updated", false);
        }
    }, defaults)); 
};

kendo.bind("#custEdit", new CustomerEditViewModel(storage.load()));