JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2011.3.1407/js/kendo.all.min.js"></script>


<button type="button" id="btnGeneralInformation" class="btn btn-info" onClick="clickMe()">Save</button>
<table id="tblTable" style="border:solid 1px blue;">
<theader>
  <th>
    Customer List
  </th>
</theader>
<tbody>
<tr>
  <td><input id="fabric-row1" placeholder="Select fabric..." style="width:100%;" /></td>
  <td id="frabrik-value1" style="visible:hidden">asdf</td>
</tr>
</tbody>
</table>
</table>

JavaScript

function clickMe()
{
alert($("#fabric-row1").data('kendoComboBox').text());
}
$( "input[id^='fabric-']" ).kendoComboBox({
                        dataTextField: "text",
                        dataValueField: "value",
                        dataSource: [
                            { text: "Cotton", value: "1" },
                            { text: "Polyester", value: "2" },
                            { text: "Cotton/Polyester", value: "3" },
                            { text: "Rib Knit", value: "4" }
                        ],
                        change: function(){
                         alert("value " + this.value());
                        },
                        filter: "contains",
                        suggest: true,
                        index: 3
                    });

function onChange()
{
  var combo = $("#fabric-row1").data("kendoComboBox");
        alert(combo.value());
        alert(combo.text());
alert("naveen");
}

var myDataSource = new kendo.data.DataSource({
        type: "odata",
        transport: {
            read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
        },
        schema: {
            model: {
                id: "OrderID",
                fields: {
                    OrderID: { type: "number" },                    
                    ShipName: { type: "string" },
                    ShipCity: { type: "string" }
                }
            }
        },
        pageSize: 50,
        serverPaging: true,
        serverFiltering: true,
    });

var $footer = $("#footer");

var gridHeight = function () {
    return $(window).height() - $footer.height() - 2;
}

var $grid = $("#myList").kendoGrid({
    scrollable: { virtual: true },
    editable: true,
    dataSource: myDataSource,
    sortable: true,
    height: gridHeight(),
    columns: [
        { field: "OrderID" },
        { field: "ShipName"},
        { field: "ShipCity", 
            editor: function(container, options) {
               ...