renderMessage

Renders a message bubble inside the chat.

Parameters

message Object

The configuration options for the message.

message.type String

The type of the message bubble to render. Can be either text or typing.

message.text String

The text of the message bubble. When the type is set to typing, this is ignored.

sender Object

The configuration object containg information about the sender of the message buggle. This determines where the message is rendered.

sender.id Object

The unique identifier, used to distinguish between different users in the chat.

sender.name String

The string representing the name of the sender, which is rendered before the message bubble.

sender.iconUrl String

The url used to show the sender avatar.

Example - Render message

<div id="chat"></div>
<script>
    $("#chat").kendoChat();

    var chat = $("#chat").data("kendoChat");

    chat.renderMessage({
        type: "text",
        text: "Hello Kendo Chat"
    }, {
        id: kendo.guid(),
        name: "Sample User",
        iconUrl: "https://demos.telerik.com/kendo-ui/content/web/chat/avatar.png"
    });
</script>

Example - Render message from chat user

<div id="chat"></div>
<script>
    $("#chat").kendoChat();

    var chat = $("#chat").data("kendoChat");

    chat.renderMessage({
        type: "text",
        text: "Hello Kendo Chat"
    }, chat.getUser());
</script>

Example - Render typing indicator

<div id="chat"></div>
<script>
    $("#chat").kendoChat();

    var chat = $("#chat").data("kendoChat");

    chat.renderMessage({
        type: "typing"
    }, chat.getUser());
</script>
In this article
Not finding the help you need? Improve this article