JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2013.1.514/js/kendo.all.min.js"></script>
<div id="container">

    <h2>Cars I Wished I Owned</h2>
    
    <div data-role="grid"
         data-bind="source: gridData,events:{edit:test}"         
         data-columns='[
             {field: "Make.Text", title: "Make"},
             {command: ["edit","destroy"], title: "&nbsp;" }                 
             ]'
         data-toolbar="[{name: 'create'}]"
         data-editable="{
            mode: 'popup',
            template: kendo.template($('#popup-editor').html())                   
         }" ></div>
    
    <script id="popup-editor" type="text/x-kendo-template">
        <div>
        <label>Choose Make:</label>
            <select data-role="dropdownlist"
            data-text-field="Text"
            data-value-field="Id"
            data-skip="true"
            data-bind="value:Make,source: models"></select>
        </div>
    </script>
    
</div>

JavaScript

var myList = [{ Id: 2, Make: { Id: 2, Text: 'Ferrari' } }];

    var carMakeList = [
        { Id: 1, Text: 'Porsche' },
        { Id: 2, Text: 'Ferrari' },
        { Id: 3, Text: 'Mercedes' }
    ];

    var myListDataSource =
        new kendo.data.DataSource({
            data: myList,
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        "Make": {
                           
                        }
                    }
                }
            }
        });

    var carMakeDataSource =
        new kendo.data.DataSource({
            data: carMakeList,
            schema: {
                model: {
                    id: "Id"
                }
            }
        });

    var viewModel = kendo.observable({
        test:function(e){ 
            if(e.model.isNew()){
             e.sender.editable.options.model.set('Make',carMakeList[0]);
            }
        },
        gridData: myListDataSource,
        models: carMakeDataSource
    });

    $(document).ready(function () {
        kendo.bind("#container", viewModel);
    });