JSFiddle - React, Tailwind, and code Playground

by MaurizioPiccini

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.2.0.js"></script>
<script src="http://fonts.googleapis.com/css?family=Play:400,700&amp;subset=latin,latin-ext"></script>
<input type: "text" data-bind="value: firstName" />
<div data-bind="text: firstName"></div>

JavaScript

$(function () {

    $.getJSON("http://api.geonames.org/citiesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&lang=de&username=demo", function (data) {

        var viewModel = {
            firstName: ko.observable("Bert"),
            lastName: ko.observable("Smith"),
            pets: ko.observableArray(["Cat", "Dog", "Fish"]),
            type: "Customer"
        };

        ko.applyBindings(viewModel);

        // Update view model properties
        viewModel.firstName(data.status.message);
        viewModel.pets(data.status.message);

    });
});