template String(default: "#:data#")

The template which is used to render the content of pages. By default the ScrollView renders a div element for every page.

Applicable only in data bound mode.

Example: single item template

<script id="scrollview-template" type="text/x-kendo-template">
  <p>#= ProductName #</p>
</script>

Example: multiple items template (data is accessed via data[index].fieldName)

<script id="scrollview-template" type="text/x-kendo-template">
    <div>
        <p>#= data[0].ProductName #</p>
    </div>
    <div>
        <p>#= data[1].ProductName #</p>
    </div>
</script>

<div data-role="view" data-stretch="true" data-init="onInit">
    <div id="scrollview"></div>
</div>

<script>
var app = new kendo.mobile.Application();

function onInit() {
    $("#scrollview").kendoMobileScrollView({
        dataSource: {
            type: "odata",
            transport: {
                read: {
                    url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products"
                }
            },
            serverPaging: true,
            pageSize: 30
        },
        itemsPerPage: 2,
        template: $("#scrollview-template").html(),
        contentHeight: 120,
        enablePager: false
    });
}
</script>