JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="https://raw.github.com/romanych/ko.editables/master/ko.editables.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/knockout.mapping.js"></script>
Fisrt name: <input type="text" data-bind="value: firstName" />
<br />
Last name: <input type="text" data-bind="value: lastName" />

JavaScript

var data = {
        firstName: 'Roman',
        lastName: 'Gomolko'
    };

var viewModel = ko.mapping.fromJS(data);
ko.editable(viewModel);
viewModel.beginEdit();

ko.subscribeTo = function(object, callback) {
    var isFirstRun = true;
    ko.computed(function() {
        ko.toJS(object);
        if (!isFirstRun) {
            setTimeout(callback, 0);
        } else {
            isFirstRun = false;
        }
    });
};

ko.subscribeTo(viewModel, function() {
    var result = {};
    var hasChanges = false;

    for (var propName in viewModel) {
        var propValue = viewModel[propName];
        if (propValue.hasChanges && propValue.hasChanges()) {
            hasChanges= true;
            result[propName] = ko.utils.unwrapObservable(propValue);
        }
    }
    
    if (hasChanges) {
        viewModel.commit();
        viewModel.beginEdit();
        alert('Data to send to server:' + ko.toJSON(result ));    
        $.ajax({
            url: '/echo/json/',
            data: result 
        }).success(function(response) {
            alert('Saved');
        });
    }
});


ko.applyBindings(viewModel);