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

Template

configuration

The template for rendering the content of the pages. By default, the ScrollView renders a div element for every page.

Applicable only in the data-bound mode.

template

String

Default: "#:data#"

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

<script id="scrollview-template" type="text/x-kendo-template">
    # for (var i = 0; i < data.length; i++) { #
    <div>
        <p>#= data[i].ProductName #</p>
    </div>
     # } #
</script>

<div id="scrollview" style="height: 120px;"></div>

<script>


$("#scrollview").kendoScrollView({
    dataSource: {
        type: "odata-v4",
        transport: {
          read: {
            url: "https://demos.telerik.com/service/v2/odata/Products"
          }
        },
        serverPaging: true,
        pageSize: 2
    },
    template: $("#scrollview-template").html(),
    contentHeight: 120,
    enablePager: false
});
</script>