Add/Edit on the client side

[Ziming]

Hello, I am trying to create a list of addresses in the javascript side, but so far most the examples are adding/editing to the server through ajax.

My question is, how to hook the correct event and maintain the list of addresses in JavaScript, I am trying onSave event but so far no success. below is my code

     var addresses = new kendo.data.DataSource({
        data: [
            { AddressName: "address1", UnitStreetNumber: 460, StreetName: "Church St", Suburb:"North Parramatta", State: "NSW", Postcode: "2150", Purpose: "Business", Primary: true }
        ]
    });

    $("#addressGrid").kendoGrid({
        dataSource: addresses,
        //pageable: true,
        toolbar: ["create"],
        columns: [
            { field: "AddressName", title: "Address Name", width: "120px" },
            { field: "UnitStreetNumber", title: "Unit/Street Number", width: "120px" },
            { field: "StreetName", title: "Street Name", width: "120px" },
            { field: "Suburb", title: "Suburb", width: "150px" },
            { field: "State", title: "State", width: "120px" },
            { field: "Postcode", title: "Postcode", width: "120px" },
            { field: "Purpose", title: "Purpose", width: "120px" },
            { field: "Primary", title: "Primary", width: "120px" },
            { command: ["edit", "destroy"], title: " ", width: "200px" }],
        editable: "popup",
        edit: onEdit,
        save: onSave
    });

function onSave(e) {
    // how to save it to addresses
}

[Plamen Lazarov]

Hello Ziming,

I would suggest you to include :

save:function(){
    this.refresh();
}

Click here to see the demo. Edit/Delete buttons can also be added to change the addresses.
Regards,
Plamen Lazarov
Telerik