New to Telerik UI for Blazor? Start a free 30-day trial

Chat Events

Updated on Jan 27, 2026

The Telerik UI for Blazor Chat component exposes various events that allow you to implement custom functionality and handle user interactions. This article lists the available events and provides examples for the most common use cases.

OnSendMessage

The OnSendMessage event fires when a user sends a new message. Use this event to handle message processing, validation, and persistence.

After the event handler executes, the Chat automatically scrolls down to the last message.

Handle the Chat OnSendMessage event

<TelerikChat Data="@ChatData"
             OnSendMessage="@OnChatSendMessage"
             Height="90vh">
</TelerikChat>

@code {
    private List<Message> ChatData { get; set; } = new();

    private string CurrentUserId { get; set; } = "user1";

    private void OnChatSendMessage(ChatSendMessageEventArgs args)
    {
        var newMessage = new ChatMessage
        {
            AuthorId = CurrentUserId,
            Text = args.Message
            
        };

        ChatData.Add(newMessage);
    }

    public class Message
    {
        public string Id { get; set; } = Guid.NewGuid().ToString();
        public string AuthorId { get; set; } = string.Empty;
        public string AuthorName { get; set; } = string.Empty;
        public string AuthorImageUrl { get; set; } = string.Empty;
        public IEnumerable<FileSelectFileInfo> Files { get; set; } = new List<FileSelectFileInfo>();
        public bool IsDeleted { get; set; }
        public bool IsPinned { get; set; }
        public bool IsTyping { get; set; }
        public string ReplyToId { get; set; } = string.Empty;
        public string Status { get; set; } = string.Empty;
        public List<string> SuggestedActions { get; set; } = new();
        public string Text { get; set; } = string.Empty;
        public DateTime Timestamp { get; set; } = DateTime.Now;
    }
}

OnSuggestionClick

The OnSuggestionClick event fires when a user clicks on a quick reply suggestion. You can use this event to customize suggestion handling.

If the handler adds new messages to the Chat, call the component Refresh() method to scroll down to the last message.

Handle Chat suggestion clicks

<TelerikChat @ref="@ChatRef"
             Data="@ChatData"
             AuthorId="@CurrentUserId"
             Suggestions="@ChatSuggestions"
             OnSuggestionClick="@OnChatSuggestionClick"
             Height="90vh">
</TelerikChat>

@code {
    private TelerikChat<Message>? ChatRef { get; set; }
    
    private List<Message> ChatData { get; set; } = new();

    private const string CurrentUserId = "user1";
    
    private List<string> ChatSuggestions { get; set; } = new();
    
    protected override void OnInitialized()
    {
        ChatData = new List<Message>();
        
        ChatSuggestions = new List<string>
        {
            "Request Project Status Update"
        };
    }

    private void OnChatSuggestionClick(ChatSuggestionClickEventArgs args)
    {
        string responseMessage = string.Empty;

        if (args.Suggestion == "Request Project Status Update")
        {
            responseMessage = "Please provide the current status of all ongoing projects.";
        }

        ChatData.Add(new Message
        {
            AuthorId = CurrentUserId,
            AuthorName = "Jane Doe",
            Text = responseMessage,
            Status = "Sent"
        });

        ChatRef?.Refresh();
    }

    public class Message
    {
        public string Id { get; set; } = Guid.NewGuid().ToString();
        public string AuthorId { get; set; } = string.Empty;
        public string AuthorName { get; set; } = string.Empty;
        public string AuthorImageUrl { get; set; } = string.Empty;
        public IEnumerable<FileSelectFileInfo> Files { get; set; } = new List<FileSelectFileInfo>();
        public bool IsDeleted { get; set; }
        public bool IsPinned { get; set; }
        public bool IsTyping { get; set; }
        public string ReplyToId { get; set; } = string.Empty;
        public string Status { get; set; } = string.Empty;
        public List<string> SuggestedActions { get; set; } = new();
        public string Text { get; set; } = string.Empty;
        public DateTime Timestamp { get; set; } = DateTime.Now;
    }
}

OnDownload

The OnDownload event fires when a user downloads files from a message. Use this event to handle file access, logging, or custom download logic.

Handle Chat file downloads

RAZOR

<TelerikChat Data="@ChatData"
             OnDownload="@OnChatDownload">
</TelerikChat>

@code {  
    private async Task OnChatDownload(ChatDownloadEventArgs args)
    {
        foreach (FileSelectFileInfo file in args.Files)
        {
            // Implement custom download logic
        }
    }
}

OnMessageUnpin

The OnMessageUnpin event fires when a user unpins a message. Handle this event to update your data model and persist the change.

Handle Chat message unpinning

RAZOR

<TelerikChat Data="@ChatData"
             OnMessageUnpin="@OnChatMessageUnpin">
</TelerikChat>

@code {
    private List<Message> ChatData { get; set; } = new();

    private void OnChatMessageUnpin(ChatMessageUnpinEventArgs args)
    {
        var message = ChatData.First(m => m.Id == args.MessageId);

        message.IsPinned = false;
    }
}

OnInputValueChanged

The OnInputValueChanged event fires when the input value changes. Use this for real-time validation, auto-save drafts, or typing indicators.

Handle Chat input value changes

RAZOR

<TelerikChat Data="@ChatData"
             InputValue="@ChatInputValue"
             OnInputValueChanged="@OnChatInputValueChanged">
</TelerikChat>

@code {
    private List<Message> ChatData { get; set; } = new();

    private string ChatInputValue { get; set; } = string.Empty;

    private void OnChatInputValueChanged(string newValue)
    {
        ChatInputValue = newValue;
    }
}

Event Arguments

The Chat events provide specific argument types with relevant data:

Event	Arguments Type	Key Properties
`OnSendMessage`	`ChatSendMessageEventArgs`	`Message`, `Files`, `ReplyMessageId`
`OnSuggestionClick`	`ChatSuggestionClickEventArgs`	`Suggestion`, `IsCancelled`
`OnDownload`	`ChatDownloadEventArgs`	`Files`, `MessageId`
`OnMessageUnpin`	`ChatMessageUnpinEventArgs`	`MessageId`
`OnInputValueChanged`	`string`	The current input value