dataSource Object|Array|kendo.data.DataSource

The data source of the widget which is used render table rows. Can be a JavaScript object which represents a valid kendo.data.DataSource configuration, a JavaScript array or an existing kendo.data.DataSource instance.

If the dataSource option is set to a JavaScript object or array the widget will initialize a new kendo.data.DataSource instance using that value as data source configuration.

If the dataSource option is an existing kendo.data.DataSource instance the widget will use that instance and will not initialize a new one.

Example - set dataSource as a JavaScript object

<div id ="listView"></div>
<script>
$("#listView").kendoListView({
     dataSource: {
        data: [
            { name: "Jane Doe" },
            { name: "John Doe" }
        ]
    },
    template: "<div>#:name#</div>"
});
</script>

Example - set dataSource as a JavaScript array

<div id ="listView"></div>
<script>
$("#listView").kendoListView({
     dataSource: [
        { name: "Jane Doe" },
        { name: "John Doe" }
    ],
    template: "<div>#:name#</div>"
});
</script>

Example - set dataSource as an existing kendo.data.DataSource instance

<div id ="listView"></div>
<script>
var dataSource = new kendo.data.DataSource({
  data: [ { name: "Jane Doe" }, { name: "John Doe" }]
});
$("#listView").kendoListView({
    dataSource: dataSource,
    template: "<div>#:name#</div>"
});
</script>
In this article