0

In an application I'm developing, i need to use the same space to display information from different sources with different formats in a grid according to what item was selected on a TreeView.

i found two ways to achieve this:

  1. find the grid then destroy and recreate it.
  2. find the grid then change datasoruce/options/

I'm very new to Kendo, so i'm not sure which approach would be wiser.

any advice?

jajdoo
  • 516
  • 1
  • 9
  • 21

2 Answers2

2

The answer depends on your usage model.

  1. How often are you going to change between datasources?
  2. How long does it take getting the new data?
  3. How much data is involved?

If it takes long time and you can switch quite often between DataSources I would go with a third approach that is having several grids and only one visible BUT if there is a lot of data involved then you should destroy the grid and recreate a new one avoiding having a lot of memory used but having to bring a lot of data back and forth.

You can go with the your second proposal (switching datasources) if you switch data and the structure of the grid is exactly the same (same columns and formatting).

OnaBai
  • 40,767
  • 6
  • 96
  • 125
0

If all your data had the same columns and options, then I would just call .setDataSource() on the grid widget to replace the data source with the new one.

However if you are changing options and columns, I think it would be better to just destroy the widget and re-create it, which would eliminate the possibility of the widget holding on to any of the old options. Something like:

function replaceGrid(selector, options) {
    var $grid = $(selector);
    var gridWidget = $grid.getKendoGrid();
    if(gridWidget) {
        gridWidget.destroy();
    }
    $grid.kendoGrid(options);
}
CodingWithSpike
  • 42,906
  • 18
  • 101
  • 138
  • and if the grid will change often? does it take long to destroy and recreate? would perhaps @OnaBai 's approach of hide-or-show be preferable? – jajdoo Jul 09 '14 at 06:41
  • The destroy/create of the widget is not really time consuming. What is time consuming is the DOM manipulation and element creation. If you swap out the entire data source, then the widget needs to remove all the elements and re-create them anyway, so the performance difference between calling .setDataSource() on one widget and destroying a re-creating a widget should be about the same (within a few milliseconds I would guess). You could keep all the grids in the DOM and just hide/show them, which would be very fast, but would use more memory to keep the data and elements in memory. – CodingWithSpike Jul 09 '14 at 13:42
  • @jajdoo, I would go with hide and show if it is switching between a couple of grids since there is no penalty in time (the grid is actually created just not displayed) but keep in mind that this will _double_ the amount of memory since both Grid objects exists simultaneously but likely this is only bad if the amount of data is very large and then you should not have the datasource created. – OnaBai Jul 09 '14 at 13:42