Kendo UI grid: refreshing grid data every 60 seconds with new data: dataSource and observe()

问题

I want to refresh the Kendo UI grid's contents every 60 seconds with up-to-the-minute data.

EDIT: Here's how the dataSource is being assigned at initial configuration:

parsedData = $.parseJSON(data);

var dataSource = new kendo.data.DataSource({
    data: parsedData
});

$("#grid").kendoGrid({
    dataSource: dataSource, 
    . . .

Can the grid's dataSource simply be reassigned in one fell swoop? Or would it be better to remove the items in the dataSource.data individually, or by clearing the array, and then injecting new items or replacing the array in its entirety? Does the implementation of observe pattern in the Kendo dataSource indicate one approach over another?

I haven't embarked on this yet, but in my experience with grids, going way back to the early days of Visual Basic, changing a grid's datasource has always had undesirable side-effects and I have no reason to expect this will be any smoother sailing. Hope I'm wrong.

ANOTHER EDIT# (26 April 2013): if there is an approach to refreshing the grid's underlying data with a new set of rows having the same structure as previously, an approach that would preserve the expanded/collapsed state of the grid's groupings, that would be ideally suited to our purposes.

回答1:

We are using Kendo 2012.3.1315.340 version and for us it works this way:

$("#YourGridNameHere").data("kendoGrid").dataSource.read();

Like that you are telling the datasource to read data once more. We usually do it on the requestEnd event handler.

I hope this helps some one.

回答2:

To update the data source of the grid use the data method:

$("#grid").data("kendoGrid").dataSource.data(parsedData);

回答3:

From your bit of sample code, it looks like your DataSource is using local data, not fetching remote data?

If it were fetching remote data, you could simply call:

$("#grid").data("kendoGrid").dataSource.sync();

And it would re-fetch from the server, as well as perform any outstanding updates or deletes, if your grid is not read-only.

For refreshing local data, you can just set the .data property on the DaaSource:

$("#grid").data("kendoGrid").dataSource.data(parsedData);

I don't have a working example in front of me to try it, but if your grid rows don't refresh after the dataSource.data() function is called, then you may also need to call refresh on the grid:

function updateGridData (parsedData) {
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.data(parsedData);
    grid.refresh();
}

回答4:

To update the grid you need to handle the change event on your dataSource.

change: function() {
    var grid = $(YouGridSelector).data("kendoGrid");
    grid.refresh();
}

This should update your grid when you change your dataSource's data.

来源：https://stackoverflow.com/questions/13892021/kendo-ui-grid-refreshing-grid-data-every-60-seconds-with-new-data-datasource-a

标签

timer

kendo-ui

grid

kendo-grid