JSFiddle - React, Tailwind, and code Playground

by petermorlion

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/knockout/2.2.1/knockout-min.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
Is Supply Point: <span data-bind="text:isSupplyPoint"></span><br/>
Is Border Point: <span data-bind="text:isBorderPoint"></span>
<br/>
Resulting JSON: <span id="jsonValue"></span>

JavaScript

$(function() {
    var model = {
        isSupplyPoint: true,
        isBorderPoint: false
    };
    
    var ViewModel = function(model) {
        ko.mapping.fromJS(model, {}, this);
        this.isSomething = ko.computed(function() {
            return this.isSupplyPoint() || this.isBorderPoint();
        }, this);
    };
    
    var viewModel = new ViewModel(model);
    
    ko.applyBindings(viewModel);
    
    var json = ko.mapping.toJSON(viewModel);
    $('#jsonValue').text(json);
});