New to Telerik UI for ASP.NET Core? Download free 30-day trial

Razor Page

This article describes an example how to configure the Telerik UI Notification for ASP.NET Core in a RazorPage scenario and get its value from the server.

For the full project with RazorPages examples, visit our GitHub repository.

    @inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf

    <button id="showNotification" class="k-button">Show notification</button>

        .Templates(t =>
                .ClientTemplate("<div>TEXT: <span class='custom-style'>#: text #</span> </div> <div>TIME: <span class='custom-style'>#: time #</span> </div>");
        $(document).ready(function () {
            $("#showNotification").click(function () {
                    url: '/Notification/NotificationIndex?handler=Read',
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    headers: {
                        RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val()
                    dataType: "json",
                    success: function (response) {
                        // Show notification based on the returned data from the server                    
                        var notification = $("#notification").getKendoNotification();
                            text: response.Text,
                            time: kendo.toString(new Date(response.Time), "dd MMMM yy hh:mm tt")
                        }, "info");
<kendo-notification name="notification"
        <notification-template type="info"
                               template="<div>TEXT: <span class='custom-style'>#: text #</span> </div> <div>TIME: <span class='custom-style'>#: time #</span> </div>">


    public JsonResult OnPostRead()
        NotificationModel model = new NotificationModel()
            Text = "Notification Text",
            Time = DateTime.Now
        return new JsonResult(model);

See Also

In this article