Edit this page

data

Gets or sets the data items of the data source.

If the data source is bound to a remote service (via the transport option), the data method will return the service response. Every item from the response is wrapped in a kendo.data.ObservableObject or kendo.data.Model (if the schema.model option is set).

If the data source is bound to a JavaScript array (via the data option), the data method will return the items of that array. Every item from the array is wrapped in a kendo.data.ObservableObject or kendo.data.Model (if the schema.model option is set).

If the data source is grouped (via the group option or the group method) and the serverGrouping is set to true, the data method will return the group items.

The schema.model configuration will not be used to parse the set data items. The data should be parsed in advance and the values should be provided in the correct type - date values should be JavaScript Date objects, numeric values should be JavaScript numbers, and others.

Compare with the view method, which will return the data items that correspond to the current page, filter, sort and group configuration.

Parameters

value Array |kendo.data.ObservableArray

The data items which will replace the current ones in the data source. If omitted the current data items will be returned.

Returns

kendo.data.ObservableArray the data items of the data source. Returns empty array if the data source hasn't been populated with data items via the read, fetch or query methods.

Example - get the data items when bound to array

<script>
var dataSource = new kendo.data.DataSource({
  data: [
    { name: "Jane Doe" },
    { name: "John Doe" }
  ]
});
dataSource.fetch(function(){
  var data = dataSource.data();
  console.log(data.length);  // displays "2"
  console.log(data[0].name); // displays "Jane Doe"
  console.log(data[1].name); // displays "John Doe"
});
</script>

Example - get the data items when bound to a remote service

<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read:  {
      url: "https://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  }
});
dataSource.fetch(function(){
  var data = dataSource.data();
  console.log(data.length);  // displays "77"
  console.log(data[0].ProductName); // displays "Chai"
});
</script>

Example - set the data items

<script>
var dataSource = new kendo.data.DataSource({
  data: [
    { name: "Jane Doe" }
  ]
});
dataSource.fetch(function(){
  dataSource.data([ { name: "John Doe" } ]);
  var data = dataSource.data();
  console.log(data[0].name); // displays "John Doe"
});
</script>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy