Changing Grid Data

[Rafi]

Hi all,
I'm trying out Kendo as an alternative to jQuery-UI and so far it is working nicely.
One thing I couldnt really figure out (I'm probably missing something....) - I created a grid from an array.
Now, I want to redraw the grid using the same element but with a different data set.
With jQuery-UI I simply could destroy the grid and the recreate it. How do I do it in Kendo?

Thanks
Rafi

[John DeVight]

Hi Rafi,

My thought would be to empty the contents of the element and then create a new grid with the same element.

For example, if I had an the following html element defined:

<div id="grid"></div>

And I initialized the grid with person information like this:

$(document).ready(function () {


    var peopleData =

        [

            { Id: 1, FirstName: "John", LastName: "Doe", Age: 46 },

            { Id: 2, FirstName: "Jayne", LastName: "Smith", Age: 13 }

        ];

  

    $('#grid').kendoGrid({

        dataSource: { data: peopleData },

        height: 250,

        columns:

        [{

            field: 'FirstName',

            title: 'First Name',

            width: 200

        }, {

            field: 'LastName',

            title: 'Last Name',

            width: 200

        }, {

            field: 'Age',

            title: 'Age',

            width: 50

        }]

    });

});

I could empty the div and populate the grid with product information like this:

changeDataSource = function () {

    // Define an array of products.

    var productData =

        [

            { Id: 1, ProductName: "Widget A", Sold: 1000 },

            { Id: 2, ProductName: "Widget B", Sold: 2000 }

        ];

  

    // Empty the grid element of all html.

    $('#grid').empty();

  

    // Initialize a new grid with the product information.

    $('#grid').kendoGrid({

        dataSource: { data: productData },

        columns:

        [{

            field: 'ProductName',

            title: 'Product Name'

        }, {

            field: 'Sold'

        }]

    });

}

Hope this helps....

Regards,

John DeVight

[Rafi]

Hi John,

That actually worked perfectly.
Thanks for the assistance and quick reply.

Rafi

[John DeVight]

Glad that worked out for you =)  If you get a chance, can you mark it as the answer...

Regards,

John DeVight

[Nick]

So what is the use of refresh method exactly?
is there no way I can just make a data refresh call (often needed when working with remote data)?
UPDATE: Ok I guess grid.dataSource.read() is the method I was looking for.