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">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.dataviz.min.css">
<script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script>
Change the selected value in the first column of either grid.
<ol>
    <li>Grid1 has a row template.<br/>When the colour is changed, the Value column <strong>is not</strong> updated in Grid1. Grid2 is fine.</li>
    <li>Grid2 does not have a row template.<br/>When the colour is changed, the Value column <strong>is</strong> updated in both grids.</li>
    <li>:(</li>
</ol>

<h3>Grid1 - With RowTemplate</h3>
<div id="gridWithRowTemplate"></div>

<h3>Grid2 - Without RowTemplate</h3>
<div id="gridWithoutRowTemplate"></div>

JavaScript

var comboBoxData = ['Red', 'Blue', 'Green'];
var gridData = [
    { Colour: 'Red', Value: 'Red' },
    { Colour: 'Green', Value: 'Green' },
    { Colour: 'Blue', Value: 'Blue' }
];

var model = kendo.observable({
    comboBoxData: comboBoxData,
    gridData: gridData
});

var comboChanged = function (event) {
    var grid = this.wrapper.closest("[data-role=grid]").data("kendoGrid"),
        rowModel = grid.dataItem(this.wrapper.closest("tr")),
        newValue = event.sender.value();    
    
    grid.closeCell();
    rowModel.set("Value", "Worked! - " + newValue);        
};

var comboEditor = function (container, options) {
    $('<input data-bind="value:' + options.field + '"/>')
    .appendTo(container)
    .kendoComboBox({
        dataSource: { data: model.comboBoxData },
        autoBind: false,
        filter: 'contains',
        suggest: true,
        change: comboChanged
    });
};

var gridColumns = [
    { field: 'Colour', title: 'Colour', editor: comboEditor },
    { field: 'Value', title: 'Value' }
];

var rowTemplate = '<tr data-uid="#=uid#"><td>#=Colour#</td><td>#=Value#</td></tr>';

var $gridWithRowTemplate = $("#gridWithRowTemplate");
var $gridWithoutRowTemplate = $("#gridWithoutRowTemplate");

$gridWithRowTemplate.kendoGrid({
    dataSource: { data: model.gridData },
    scrollable: true,
    filterable: true,
    selectable: true,
    navigatable: true,
    editable: { confirmation: false },
    height: 150,
    columns: gridColumns,
    rowTemplate: kendo.template(rowTemplate)
});

$gridWithoutRowTemplate.kendoGrid({
    dataSource: { data: model.gridData },
    scrollable: true,
    filterable: true,
    selectable: true,
    navigatable: true,
    editable: { confirmation: false },
    height: 150,
    columns: gridColumns
});