Kendo Grid -setting new data source

Question

so I created a table using Kendo Grid, I create it based on a existing table code:

<table data-role="street-search-results-grid">
        <thead>
        <tr>
            <th data-field="name">Object</th>
            <th data-field="address">Street</th>
            <th data-field="house_no">House nr.</th>
            <th data-field="city">City</th>
        </tr>
        </thead>
    </table>

When I first open this view, I get an empty table which is fine. Then I start searching, and the table fills okay, except table head cells also change their values. So I don't have anymore Object, Street, House nr. and City, but name, address, house_no and city (which are response json keys).

After I get data from server, I update grid's data source by:

       var grid = $(_streetSearchResultsRole).data("kendoGrid");
        grid.setDataSource(new kendo.data.DataSource({
            data: res.data
        }));

Anyone had similar problem?

Tnx :)

Answer 1

The grid will recreate its columns when you use the setDataSource method. You can call the data method of the current data source instead.

grid.dataSource.data(res.data);

Here is a live demo: http://jsbin.com/ACuyoKej/1/edit