pageableBoolean|Object(default: false)
If set to true the ListView will display a pager. By default paging is disabled.
Can be set to a JavaScript object which represents the pager configuration.
Don't forget to set a
pageSize, no matter if paging is performed client-side or server-side. ApageSizecan be defined in thepageablesettings, or in thedataSourcesettings. If an already existing datasource instance is passed to the ListView, then thepagesizeoption should be set in the dataSource's settings and not in thepageablesettings.
Example - enable paging
<div id="listView"></div>
<script type="text/x-kendo-tmpl" id="template">
<div class="product-view k-widget">
<dl>
<dt>Product Name</dt>
<dd>#:ProductName#</dd>
</dl>
</div>
</script>
<script>
$(document).ready(function () {
var crudServiceBaseUrl = "https://demos.telerik.com/service/v2/core",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "/Products"
}
},
pageSize: 10
});
var listView = $("#listView").kendoListView({
dataSource: dataSource,
template: kendo.template($("#template").html()),
navigatable: true,
pageable: true
}).data("kendoListView");
});
</script>In this article