Unfinished GridRowTemplate
by subev
HTML
<script src="http://cdn.kendostatic.com/2011.3.1129/js/kendo.all.min.js"></script>
<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">
<div id="example" class="k-content">
<table id="netflixTable">
<thead>
<tr>
<th>
Cover
</th>
<th>
Title
</th>
<th>
Rating
</th>
<th>
DropDownTesting
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script id="rowTemplate" type="text/x-kendo-tmpl">
<tr>
<td>
<img src="${ BoxArt.SmallUrl }" alt="${ Name }" />
</td>
<td>
${ Name }
</td>
<td>
${ AverageRating }
</td>
<td>
<input class='DropDownTemplate'/>
</td>
</tr>
</script>
</div>
JavaScript
$(document).ready(function() {
$("#netflixTable").kendoGrid({
dataBound:function(){
$('.DropDownTemplate').kendoDropDownList({
index: 1,
dataTextField: "AREA_NAME",
dataValueField: "AREA_ID",
dataSource: {
transport: {
read: {
url:"http://myfpateaches.com/framework/ModelGlue.cfc?method=Glue_Get_JSONP_Read&modelName=areas",
dataType: "JSONP"
}
}
}
});
},
dataSource: {
type: "odata",
serverFiltering: true,
filter: [{
field: "Name",
operator: "contains",
value: "Star Wars"
},{
field: "BoxArt.SmallUrl",
operator: "neq",
value: null
}],
transport: {
read: "http://odata.netflix.com/Catalog/Titles"
}
},
rowTemplate: kendo.template($("#rowTemplate").html()),
height: 500
});
});