JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js"></script>
<button data-bind="click: loadJson">Load JSON</button>
<p>First name:
<input data-bind="value: firstName" />
</p>
<p>Last name:
<input data-bind="value: lastName" />
</p>
JavaScript
// Here's my data model
var ViewModel = function (firstName, lastName) {
var self = this;
self.firstName = ko.observable(firstName);
self.lastName = ko.observable(lastName);
self.loadJson = function () {
$.getJSON("http://echo.jsontest.com/firstName/Stuart/lastName/Little",
function (data) {
self.firstName(data.firstName);
self.lastName(data.lastName);
});
};
};
var vm = new ViewModel("Planet", "Earth");
ko.applyBindings(vm); // This makes Knockout get to work