JSFiddle - React, Tailwind, and code Playground

HTML

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

<button>rebind</button>

JavaScript

var encTemplate = kendo.template("<tr><td> #= EntityName # </td><td><input type='checkbox' name='Client1' # if(Client1){ # checked='checked' # } # /> </td><td><input type='checkbox' name='Client2' # if(Client2){ # checked='checked' # } # /> </td></tr>");

var encTemplate2 = kendo.template("<tr><td> #= EntityName # </td><td><input type='checkbox' name='Client1' # if(Client1){ # checked='checked' # } # /> </td><td><input type='checkbox' name='Client2' # if(Client2){ # checked='checked' # } # /> </td><td><input type='checkbox' name='Client3' # if(Client3){ # checked='checked' # } # /> </td></tr>");


var grid = $("#grid").kendoGrid({ 
    scrollable: false,
    sortable: true,
    dataSource: [{EntityName: "test inc",Client1: false, Client2: true}],
    rowTemplate: encTemplate
}).data("kendoGrid"); 

$("button").click(function() {
    var ds = grid.dataSource;
    
    grid.columns = [];
    grid.thead.remove();
    grid.rowTemplate = encTemplate2;
    ds.data([{EntityName: "test inc",Client1: false, Client2: true, Client3: false}]);
    grid.refresh();
});