or
peopleData = [ { Id: "jaaron", FirstName: "John", LastName: "Aaron", Age: 46 }, { Id: "agent2", FirstName: "Jayne", LastName: "Smith", Age: 13 }];peopleDS = new kendo.data.DataSource({ data: peopleData, change: function (e) { console.log(this.data().length + ' records'); }});for (var i = 0; i < peopleData.length; i++) { if (peopleData[i].Id === "jaaron") { peopleData[i].Age = 55; break; }}peopleDS.read(peopleData);peopleData = {};peopleData["jaaron"] = { FirstName: "John", LastName: "Aaron", Age: 46 };peopleData["agent2"] = { FirstName: "Jayne", LastName: "Smith", Age: 13 };<!DOCTYPE html><html> <head> <link href="../styles/kendo.metro.min.css" rel="stylesheet"> <link href="../styles/kendo.common.min.css" rel="stylesheet"> <script src="../js/jquery.min.js"></script> <script src="../js/kendo.all.min.js"></script> </head> <body> <div id="grid" style="width:1024px; height:400px; margin-left:auto; margin-right:auto;"></div> <script> $(document).ready(function() { $("#grid").kendoGrid({ dataSource: { transport: { read: "load.php", update: { url: "load.php", type: "POST" }/*, destroy: { url: "load.php", type: "DELETE" }*/ }, error: function(e) { alert(e.responseText); } }, columns: [ { field: "termekid", width:"70px" }, /* ... */ { field: "szin", width:"74px", editor: szinColorPickerEditor } /* ... */ ], sortable: true, editable: true, navigatable: true, toolbar: ["save", "cancel"/*, "create"*/], pageable: { previousNext: true, numeric: true, buttonCount: 5, input: false, pageSizes: [0, 10, 20, 50, 100], refresh: true, info: true } }); function szinColorPickerEditor(container, options) { $("<input type='color' data-bind='value:" + options.field + "' />") .appendTo(container) .kendoColorPicker({ buttons: true }); } }); </script> </body> </html>
