Hi, i have a grid which is not sorting correctly. I am using a template
to define columns. I think the issue is that the column sort value/field
for the individual columns is not explicitly defined so i don't see how
the grid would know what to sort on. How can i define which field each
column in my template should sort on?
$("#listGrid").kendoGrid({
rowTemplate: kendo.template($("#detailsTemplate").html().replace('k-alt', '')),
altRowTemplate: kendo.template($("#detailsTemplate").html()),
scrollable: false,
dataSource: {
transport: {
read: url
},
schema: {
model: {
fields: {
ItemId: { type: "number", sortable: true },
ItemName: { type: "string", sortable: true },
Created: { type: "date", sortable: true },
Modified: { type: "date", sortable: true },
OwnerName: { type: "string", sortable: true },
OwnerId: { type: "number", sortable: true }
}
}
}
},
sortable:true
});
<script id="detailsTemplate" type="text/x-kendo-template">
<tr class="row k-alt">
<td>
<a href="/Members/Chart.aspx?costDriverId=#=ItemId#">#= ItemName#</a>
</td>
<td>
#= kendo.toString(Created, "dd/MM/yyyy") #
</td>
<td>
#= kendo.toString(Modified, "dd/MM/yyyy") #
</td>
<td>
#if(OwnerId.toString() == userInfo.UserId){#
Me
#}else{#
#:OwnerName#
#}#
</td>
<td>
<a class="copyLink" onclick="copyCustomData(#=ItemId#, this) href="\#">Copy</a>
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a class="editLink" href="/CustomData/?id=#=ItemId#">Edit</a>
#}#
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a href="\#" onclick="deletePricingModel(#=ItemId#, this);return false;"><img src="/Content/images/member/delete_icon.gif" alt="Delete" /></a>
#}#
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a href="\#" onclick="sharePricingModel(#=ItemId#);return false;"><img src="/Content/images/member/iconShare.gif" alt="Manage Sharing" /></a>
#}#
</td>
</tr>
</script>
$("#listGrid").kendoGrid({
rowTemplate: kendo.template($("#detailsTemplate").html().replace('k-alt', '')),
altRowTemplate: kendo.template($("#detailsTemplate").html()),
scrollable: false,
dataSource: {
transport: {
read: url
},
schema: {
model: {
fields: {
ItemId: { type: "number", sortable: true },
ItemName: { type: "string", sortable: true },
Created: { type: "date", sortable: true },
Modified: { type: "date", sortable: true },
OwnerName: { type: "string", sortable: true },
OwnerId: { type: "number", sortable: true }
}
}
}
},
sortable:true
});
<script id="detailsTemplate" type="text/x-kendo-template">
<tr class="row k-alt">
<td>
<a href="/Members/Chart.aspx?costDriverId=#=ItemId#">#= ItemName#</a>
</td>
<td>
#= kendo.toString(Created, "dd/MM/yyyy") #
</td>
<td>
#= kendo.toString(Modified, "dd/MM/yyyy") #
</td>
<td>
#if(OwnerId.toString() == userInfo.UserId){#
Me
#}else{#
#:OwnerName#
#}#
</td>
<td>
<a class="copyLink" onclick="copyCustomData(#=ItemId#, this) href="\#">Copy</a>
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a class="editLink" href="/CustomData/?id=#=ItemId#">Edit</a>
#}#
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a href="\#" onclick="deletePricingModel(#=ItemId#, this);return false;"><img src="/Content/images/member/delete_icon.gif" alt="Delete" /></a>
#}#
</td>
<td>
#if((OwnerId.toString() == userInfo.UserId) || (userInfo.IsGAM == true)){#
<a href="\#" onclick="sharePricingModel(#=ItemId#);return false;"><img src="/Content/images/member/iconShare.gif" alt="Manage Sharing" /></a>
#}#
</td>
</tr>
</script>