CODEWITHSUNDEEP
javascriptgridkendo-ui
Vasco Costa
Vasco Costa

Reputation: 341

How can I add items to the data source of a kendo ui grid

I have created a kendo.data.dataSource with success, and I am able to bind it to the KendoUI Grid on my page.

But when I try to dataSource.insert(0, [a : "b"]); it removes the data that was there previously.

My example code follows:

var tempSource = new kendo.data.DataSource({
     data: [{"ID":1,"Name":"Cliente 1","NameID":"1 - Cliente 1"},{"ID":2,"Name":"Cliente 2","NameID":"2 - Cliente 2"}]
});

This is how I'm binding to the grid:

$("#association-grid").kendoGrid({
height: 99,
columns:
[
    {
        field: "ID",
        title: "ID"
    },
    {
        field: "Name",
        title: "Name"
    },
    {
        field: "NameID",
        title: "NameID"
    }
],

dataSource: tempSource
});

This is how I add a new item:

tempSource.insert(0, { ID: "John Smith", Name: "Product Description", NameID: "123 1st Street" });

If I perform the add before binding the data to the Grid, I lose the first two items that were originally on the dataSource object.

In summary: I have a pre-created dataSource binded to a Grid. I want to be able to add a new item to the dataSource, and then refresh the Grid so that the new item appears.

Thanks,

VRC

Upvotes: 11

Views: 36004

Answers (2)

Sajjad Ali Khan
Sajjad Ali Khan

Reputation: 1813

var grid = $("#itemsGrid").data("kendoGrid");

                    for (var i = 0; i < data.length; i++) {

                        grid.dataSource.insert(data[i]);
                    }

inserting new record to grid datasource

Upvotes: 0

Zaheer Ahmed
Zaheer Ahmed

Reputation: 28528

try this:

dataSource.add({ name: "John Smith", description: "Product Description", address: "123 1st Street" });

Upvotes: 26

Related Questions