JSFiddle - React, Tailwind, and code Playground
by NoseBagUK
HTML
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js"></script>
<div class="viewPerson">
<strong>Name:</strong> <span data-bind="text: Person.Name"></span>
</div>
<br /><br /><br />
<div class="editPerson">
<strong>Name:</strong> <input type="text" data-bind="value: Person.Name"></span>
<input type="submit" value="Save" data-bind="click: Save" />
</div>
JavaScript
$(function () {
var person = function() {
var self = this;
self.Name = ko.observable("Bob");
}
var viewModel = function(pers) {
var self = this;
self.Person = pers;
self.Save = function() {
$.ajax({
url: "/echo/json/",
type: "POST",
dataType: "json",
contentType: "application/json;charset=utf-8",
data: JSON.stringify(self),
success: function (data) {
alert("Now Update display")
}
});
};
};
var thisPerson = new person();
var thisModel = new viewModel(thisPerson);
ko.applyBindings(thisModel);
});