JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script>
<ol>
<li>
Telephone : <input data-bind="value: telephone"/>
</li>
<li>
Address : <input data-bind="value: address"/>
</li>
</ol>
JavaScript
var model = {
telephone: ko.observable('0294658963'),
address: ko.observable('167 New Crest Rd')
};
// knockout extension for creating a changedFlag (similar to Ryan's dirty flag except it resets itself after every change)
ko.changedFlag = function(root) {
var result = function() {};
var initialState = ko.observable(ko.toJSON(root));
result.isChanged = ko.dependentObservable(function() {
var changed = initialState() !== ko.toJSON(root);
if (changed) result.reset();
return changed;
});
result.reset = function() {
initialState(ko.toJSON(root));
};
return result;
};
// add changed flag property to the model
model.changedFlag = new ko.changedFlag(model);
// subscribe to changes
model.changedFlag.isChanged.subscribe(function(isChanged) {
if (isChanged) alert("model changed");
});
ko.applyBindings(model);