JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://knockoutjs.com/js/knockout-2.1.0.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css">
<script src="http://poi1.com/kendo/js/kendo.core.js"></script>
<script src="http://poi1.com/kendo/js/kendo.data.js"></script>
<script src="http://poi1.com/kendo/js/kendo.grid.js"></script>
<script src="http://poi1.com/kendo/js/kendo.binder.js"></script>
<script src="http://poi1.com/kendo/js/kendo.editable.js"></script>
<script src="http://poi1.com/kendo/js/kendo.validator.js"></script>
<div id="grid"></div>
<a href="#" id="showData">Show Data</a>
<code id="dataDetails">
</code>

JavaScript

var sourceData = [
    { Position: 'One', Simple: 'foo', Complex: { Login: 'foo', Description: 'foo - Foo Frye' } },
    { Position: 'Two', Simple: 'bar', Complex: { Login: 'bar', Description: 'bar - Bar River' } },
    { Position: 'Three', Simple: 'bar', Complex: { Login: 'bar', Description: 'bar - Bar River' } },
    { Position: 'Four', Simple: 'baz', Complex: { Login: 'baz', Description: 'baz - Jayne Baz' } },
];

var nameList = [
    { Login: 'foo', Description: 'foo - Foo Frye' },
    { Login: 'bar', Description: 'bar - Bar River' },
    { Login: 'baz', Description: 'baz - Jayne Baz' },
    { Login: 'zoom', Description: 'zoom - Zoe Zoom' },
    ];

var mySimpleEditor = function(container, options) {
    var ed = $('<select ' +
            ' data-bind=" source: listSource.list, value: ' + options.field + '" ' +
            ' data-text-field="Description" ' +
            ' data-value-field="Login" ' + 
            ' />')
    options.model.listSource = kendo.observable({list: nameList})
    ed.appendTo(container);       
}
var myComplexEditor = function(container, options) {
    var ed = $('<select ' + 
            ' data-text-field="Description" ' + 
            ' data-bind=" source: listSource.list, value: ' + options.field + '" />')
    options.model.listSource = kendo.observable({list: nameList})
    ed.appendTo(container)
}
$('#grid').kendoGrid({
    dataSource: {
        data: sourceData,
        schema: {
            model: {
                fields: {
                    Position: { type: 'string' },
                    Simple: { type: 'string' },
                    Complex: { type: 'object' },
                },
            }
        }
    },
    editable: true, 
    columns: [
        { field: 'Position' },
        {
            field: 'Simple',
            editor: mySimpleEditor,
        },
    
        {
            field: 'Complex',
            template: '#=Complex.Description#',
            editor: myComplexEditor,
        },
   ...