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

PageSize

configuration

Documents the default endless batch size.

When scrollMode is set to "endless", the effective batch size comes from dataSource.pageSize() for the initial latest window, older/newer adjacent loads, and jump requests. Configure the bound DataSource page size for endless mode instead of relying on a separate Chat range contract, because a root Chat pageSize value does not override the bound DataSource page size.

If the bound DataSource does not declare a valid page size, the Chat seeds the DataSource with the default endless batch size of 20 before the first endless load.

pageSize

Number

Default: 20

<div id="chat"></div>
<script>
var messages = [];

for (var i = 1; i <= 30; i++) {
    var isCustomer = i % 3 === 0;

    messages.push({
        id: i,
        authorId: isCustomer ? "customer" : "dispatcher",
        authorName: isCustomer ? "Mila Chen" : "Dispatch Team",
        authorImageUrl: isCustomer ? "https://demos.telerik.com/kendo-ui/content/web/Customers/LONEP.jpg" : "https://demos.telerik.com/kendo-ui/content/web/Customers/RICSU.jpg",
        text: isCustomer ? "Please confirm delivery checkpoint " + i + "." : "Delivery checkpoint " + i + " was recorded for shipment 44018.",
        timestamp: new Date(2026, 0, 11, 10, i)
    });
}

var dataSource = new kendo.data.DataSource({
    data: messages,
    pageSize: 8
});

$("#chat").kendoChat({
    authorId: "customer",
    dataSource: dataSource,
    height: 480,
    scrollMode: "endless"
});
</script>