New to Kendo UI for jQuery? Start a free 30-day trial

The data source of the widget. Configured via the dataSource option.

Changes to the data source will be reflected in the widget.

Assigning a new data source would have no effect. Use the setDataSource method instead.

dataSource

kendo.data.DataSource
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30}
  ]
});
var grid = $("#grid").data("kendoGrid");
grid.dataSource.add({ name: "John Doe", age: 33 });
</script>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 }
  ]
});
var grid = $("#grid").data("kendoGrid");
var data = grid.dataSource.at(0);
data.set("name", "John Doe");
</script>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30},
    { name: "John Doe", age: 33},
  ]
});
var grid = $("#grid").data("kendoGrid");
var data = grid.dataSource.at(1);
grid.dataSource.remove(data);
</script>
Not finding the help you need?
Contact Support