emptyTemplate String(default: "")

The template for rendering the pages without content. By default, the ScrollView renders a blank page.

Applicable only in the data-bound mode.


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

<script id="scrollview-template" type="text/x-kendo-template">
  <div style="width: 110px; height: 110px; background-image: #=setBackground(ProductID)#;"></div>
  <p>#= ProductName #</p>

<script id="scrollview-empty" type="text/x-kendo-template">
  <div style="width: 100%; height: 100%; background-color: red;">empty</div>


var dataSource = new kendo.data.DataSource({
  type: "odata",
  transport: {
    read: {
      url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products"
  serverPaging: true

function setBackground(id) {
  return "url(https://demos.telerik.com/kendo-ui/content/web/foods/" + id +".jpg)";

    dataSource: dataSource,
    template: "scrollview-template",
    emptyTemplate: "scrollview-empty",
        contentHeight: "100%"
In this article