JSFiddle - React, Tailwind, and code Playground

by korchev

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2012.1.515/js/kendo.all.min.js"></script>
<input data-role="combobox" data-min-length="1" data-text-field="text" data-value-field="value" id="cboSuffix" maxlength="20" data-bind="source: Suffixes, value: Contact.Suffix" style="width: 80px" />
<button data-bind="click: showJSON">Show JSON</button>

CSS

.selected{
  background: red;
  color: white;    
}

JavaScript

var viewModel = kendo.observable({
    showJSON: function() {
        alert(kendo.stringify(this.toJSON()));
    },
    Suffixes: [{
        text: "Sr.",
        value: "Sr."
    },{
        text: "Jr.",
        value: "Jr."
    }
    ],
    Contact: {
        Suffix: "Jr."
    }
});

kendo.bind(document.body, viewModel);