CODEWITHSUNDEEP
angularjskendo-ui
bob.mazzo
bob.mazzo

Reputation: 5627

How to re-initialize a Kendo grid with a new dataSource

I'm working in asp.net mvc3 with Angular, and Kendo UI.

I'm slowly working my way to creating some kind of generic grid to handle the various data responses I will be getting.

In the previous framework, we would use $("#mainGrid").data("kendoGrid").destroy() before re-initializing it. However, in the Angular controller, I can't figure out how to destroy/recreate my grid with an updated DataSource (new schema and data).

Here's my generic grid function:

 function initHierarchyGrid_Generic(reportType, data, refresh) {            

        var myModel = gridHierarchyService.getDataSourceModel(reportType, data);
        var myColumns = gridHierarchyService.getColumnDefs(reportType, data);
        var myData = gridHierarchyService.getDataRows(reportType, data);

        var ds = new kendo.data.DataSource({
            schema: {
                model: myModel
            },
            pageSize: 5,
            data: myData
        });
        ds.read();

        vm.mainHierGridOptions = {
            dataSource: ds,
            pageable: true,
            detailInit: detailInit,  // detailInit() determines nested levels.                      
            columns: myColumns
        };           

        if (refresh) {     // NEW LOGIC TO REFRESH THE DATASOURCE (as per suggestion)
            var grid = $('#mainGrid').data("kendoGrid");
            grid.setDataSource(ds);
        }

        return vm.mainHierGridOptions;
    }

I would appreciate your help.

regards, Bob

UPDATE: I now pass in a refresh parameter, and use grid.setDataSource(ds); to trigger a grid update. It does indeed update the grid, however my grid is now empty. I suspect it's a data-related issue.

Renders with bad data display (my data is correct though)

In this case if I use the k-bind="vm.mainHierGridOptions" in the html as follows then Chrome blows up with wierd $digest iterations error :

$digest iterations error

Upvotes: 0

Views: 4273

Answers (1)

Rajesh TV
Rajesh TV

Reputation: 71

Reinitializing the data is best done with the ds.data(yournewdata) call. I'm not sure how the schema can be changed as well.

Upvotes: 1

Related Questions