I have a Kendo Grid we are using as part of a Document Manager style setup. We would like to have heartbeat functionality that automatically refreshes the grid when it detects changes on the server, checking every 60 seconds or so. Unfortunately, one of the objects in the grid is a Silverlight object which must remain in place to monitor a file on the local user's system (in the Silverlight Isolated Storage). If the UI gets refreshed, we lose the Silverlight object and it has to be regenerated.
I would like to stop any UI refresh that would result in the same document listing as what is currently there. Essentially, I need to use a hasChanges type functionality, but I don't know where to put it.
I've reviewed dataSource.hasChanges but the example just shows a fetch and then add, I don't know how this relates to the .read function automatically refreshing the UI.
Some example code to show where I'm coming from in this:
fileInformationDataSource = new kendo.data.DataSource({
transport: {
read: function (options) {
kendo.ui.progress($("#fileInformationGrid"), true);
var id = options.data.parentId;
showHidden = options.data.showHidden;
if (!id) { id = selectedTreeFolderId; }
if (!showHidden) { showHidden = false; }
// the below is a Spring implementation, it's basically just a fancy javascript to C# function caller with specific parameters
DocumentWebService.GetFolderTreeInformation(documentTreeType, id,
utcOffsetInMins, isDstSupported, userId, showHidden,
function (result) {
options.success(result);
initializeMyDocuments();
kendo.ui.progress($("#fileInformationGrid"), false);
},
function (e) { options.error(e); }
);
}
},
batch: true,
pageSize: 8,
schema: {
model: {
id: "Id",
fields: {
Id: { editable: false, nullable: true },
Name: {}
}
}
}
});
fileInformationGrid = $("#fileInformationGrid").kendoGrid({
dataSource: fileInformationDataSource, sortable: false, pageable: true, autoBind: false,
columns: [ /*my columns implementation */ ], selectable: "row",
change: function () { /* starts a separate ajax call to pull file details for loading into another piece of UI */ }
});
// Read function implemented inside the heartbeat
// There is a separate Kendo Tree View which shows explorer style folder navigation, the selectedId is coming from that UI
fileInformationDataSource.read({ parentId: selectedId });
I would like to stop any UI refresh that would result in the same document listing as what is currently there. Essentially, I need to use a hasChanges type functionality, but I don't know where to put it.
I've reviewed dataSource.hasChanges but the example just shows a fetch and then add, I don't know how this relates to the .read function automatically refreshing the UI.
Some example code to show where I'm coming from in this:
fileInformationDataSource = new kendo.data.DataSource({
transport: {
read: function (options) {
kendo.ui.progress($("#fileInformationGrid"), true);
var id = options.data.parentId;
showHidden = options.data.showHidden;
if (!id) { id = selectedTreeFolderId; }
if (!showHidden) { showHidden = false; }
// the below is a Spring implementation, it's basically just a fancy javascript to C# function caller with specific parameters
DocumentWebService.GetFolderTreeInformation(documentTreeType, id,
utcOffsetInMins, isDstSupported, userId, showHidden,
function (result) {
options.success(result);
initializeMyDocuments();
kendo.ui.progress($("#fileInformationGrid"), false);
},
function (e) { options.error(e); }
);
}
},
batch: true,
pageSize: 8,
schema: {
model: {
id: "Id",
fields: {
Id: { editable: false, nullable: true },
Name: {}
}
}
}
});
fileInformationGrid = $("#fileInformationGrid").kendoGrid({
dataSource: fileInformationDataSource, sortable: false, pageable: true, autoBind: false,
columns: [ /*my columns implementation */ ], selectable: "row",
change: function () { /* starts a separate ajax call to pull file details for loading into another piece of UI */ }
});
// Read function implemented inside the heartbeat
// There is a separate Kendo Tree View which shows explorer style folder navigation, the selectedId is coming from that UI
fileInformationDataSource.read({ parentId: selectedId });