altRowTemplate String|Function
The template which renders the alternating table rows. Be default the grid renders a table row (<tr>
) for every data source item.
The outermost HTML element in the template must be a table row (
<tr>
). That table row must have theuid
data attribute set to#= uid #
. The grid uses theuid
data attribute to determine the data to which a table row is bound to. Set theclass
of the table row tok-alt
to get the default "alternating" look and feel.
Example - specify alternating row template as a function
<div id="grid"></div>
<script id="alt-template" type="text/x-kendo-template">
<tr data-uid="#= uid #">
<td colspan="2">
<strong>#: name #</strong>
<strong>#: age #</strong>
</td>
</tr>
</script>
<script>
$("#grid").kendoGrid({
dataSource: [
{ name: "Jane Doe", age: 30 },
{ name: "John Doe", age: 33 }
],
altRowTemplate: kendo.template($("#alt-template").html())
});
</script>
Example - specify alternating row template as a string
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
dataSource: [ { name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 } ],
altRowTemplate: '<tr data-uid="#= uid #"><td colspan="2"><strong>#: name #</strong><strong>#: age #</strong></td></tr>'
});
</script>