JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

$(function () {
    var columns = [
        {
            field: "ResourceName",
            title: "Resource Name",
        },                
        {
            field: "Hours",            
            type: "int"            
        }
    ];
    
    var data = [
        { ResourceName: 'Andy Pham', Hours: 1 },
        { ResourceName: 'Swetha Pullagurla', Hours: 2 }
    ];
    
    var grid = $('#grid').kendoGrid({            
        dataSource: data,
        columns: columns,
        editable: 'incell',
        edit: function(ev){
            // do not put it here because editCell will trigger the edit event causing an ugly loop!!
        }
    });        
    
    // this is what you need, is to force the last cell into edit mode
    alert(grid.editCell(grid.tbody.find('tr:eq(0) td:last')));
});