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/2013.1.319/js/kendo.all.min.js"></script>
<div id='grid' data-bind='source: items'>
</div>
JavaScript
$("#grid").kendoGrid({
sortable:true,
rowTemplate:'<tr class="k-master-row"> <td class="k-hierarchy-cell"><a class="k-icon k-plus" href=""></a></td><td><a data-bind:"click:highlight">click in row ${id}</a></td><td>${bool}</td></tr>',
detailTemplate:'<a data-bind:"click:highlight">click In details ${id}</a>',
columns: [{field:'id',sortable:false}, {field:'bool'}],
dataBound: function(e) {
var grid=$("#grid").data('kendoGrid');
grid.expandRow("tr.k-master-row");
}
});
var model=( {
highlight:function(){
console.log(this.id);
},
items:[{id: 1123, bool: true}, {id: 223, bool: false}]
});
kendo.bind($("#grid"),kendo.observable(model));