JSFiddle - React, Tailwind, and code Playground

by lazyberezovsky

HTML

<div>Price:
    <input data-bind="value: price, valueUpdate:'afterkeydown'" />
</div>
<div>Qty:
    <input data-bind="value: qty, valueUpdate:'afterkeydown'" />
</div>
<div>Total:
    <input data-bind="value: total, valueUpdate:'afterkeydown'" />
</div>

JavaScript

var ViewModel = function () {
    var self = this;

    self.price = ko.observable(0);
    self.qty = ko.observable(0);
    self.total = ko.observable(0);

    self.price.subscribe(function(value) {
        self.total(self.qty() * value);
    });

    self.qty.subscribe(function (value) {
        self.total(self.price() * value);
    });

    self.total.subscribe(function (value) {
        self.price(value / self.qty());
    });
};

ko.applyBindings(new ViewModel);