I am working on a project where we use KENDOUI for the front-end with jQuery/Javascript coding to manage anything that we can't do with the framework itself.
I have a KENDO Grid which needs client side sorting and here is what I am trying to do -
var tPositiondata = _DetailsGridDS.data();
// sort position datasource in order to bind treeview
tPositiondata = tPositiondata.toJSON().sort(function (a, b) {
{
if ((a.DisplayText.localeCompare(b.DisplayText)) < 0) { return -1; }
else if ((a.DisplayText.localeCompare(b.DisplayText)) > 0) { return 1; }
}
});
//re-initialize the grid with new datasource
$("#DivDetailsTable").empty();
$("#DivDetailsTable").kendoGrid({
autobind: false,
scrollable: true,
height: 333,
pageSize: 10,
dataSource: tPositiondata,
dataBound: OnReceivedDataFromDatasource,
columns: [
{
field: "UniqueValue",
title: _ColumnHeaderUniqueValue
},
{
//field: "DisplayTextTranslation",
title: _ColumnHeaderDisplayText,
template: '#= GetTranslation(Id) #'
},
{
field: "CodeAttribute",
title: _ColumnHeaderCodeAttribute
},
{ command: [{ text: _ButtonEdit, className: "k-button k-button-icontext buttonEdit k-grid-Edit" }, { text: _ButtonDelete, className: "k-button k-button-icontext buttonDelete k-grid-Delete" }, { text: " ", className: "buttonUp", width: 15 }, { text: " ", className: "buttonDown", width: 15}], text: "", title: " ", width: 230 }
],
editable: "inline"
});
Now the trouble is that , the variable "tPositionData" cannot be re-assigned to "_DetailsGridDS" because they are obviously not the same type or format. Because of this, my global variable "_DetailsGridDS" doesn't have the updated sorted data. If I refer to it somewhere else in code, then I am not having sorted data.
Can someone please help me to either "undo" / "reverse" the .toJSON call after sorting so that I can re-assign it to _DetailsGridDS or can someone suggest a work-around so that my global var is always updated with latest sorted data ?