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

AttachmentTemplate

configuration

The template used to render individual attachments within messages. Receives the attachment data object and should return an HTML string. When not set, the default attachment rendering is used.

The function receives the attachment object with properties such as title, subtitle, image, contentType, and content.

attachmentTemplate

Function

Default: null

<div id="chat"></div>
<script>
let messagesData = [
    {
        id: 1,
        text: "Check out this file:",
        authorId: "user1",
        authorName: "John",
        timestamp: new Date(),
        attachments: [
            { title: "Report.pdf", contentType: "application/pdf", content: "#" }
        ]
    }
];

$("#chat").kendoChat({
    attachmentTemplate: function(attachment) {
        return '<div class="custom-attachment">' +
               '<span class="k-icon k-i-file"></span> ' +
               '<a href="' + attachment.content + '">' + attachment.title + '</a>' +
               '</div>';
    },
    authorId: "user1",
    dataSource: messagesData
});
</script>