Add & Edit Button in toolbar

[Vinod]

I need help on the Add / Edit buttons in toolbar of grid which is bound using local data. Once we add or edit next time when I hit cancel grid is bound with duplicate records except for newly added or updated data. I am sharing the code here http://jsfiddle.net/cE3uM/11/ Its not functioning in fiddle, but in my project its working fine except for this bug. Could please help me find a solution?

Thanks

[Vladimir Iliev]

Hi Vinod,

 
Basically current behavior is expected with the current logic - please note that to be able to edit grid data you should define "update" and "create" functions for the grid. Please check the example below:

var data = [{
        Id: 1,
        Name: "Product 1",
    }, {
        Id: 2,
        Name: "Product 2",
    }, {
        Id: 3,
        Name: "Product 3"
    }
];

var dataSource = new kendo.data.DataSource({
    transport: {
        read: function (e) {
            e.success(data);
        },
        update: function (e) {
            e.success();
        },
        create: function (e) {
            var item = e.data;
            item.Id = data.length + 1;
            e.success(item);
        }
    },
    schema: {
        model: {
            id: "Id",
            fields: {
                Id: {
                    type: "number"
                },
                Name: {
                    type: "string"
                }
            }
        }
    }
});

var grid = $("#grid").kendoGrid({
    dataSource: dataSource,
    scrollable: false,
    editable: true,
    navigatable: true,
    toolbar: ["save", "cancel", "create"],
    columns: ["Id", "Name"]
}).data("kendoGrid");

 Kind Regards,
Vladimir Iliev
the Telerik team