Edit this page

Notification HtmlHelper Overview

The Notification HtmlHelper extension is a server-side wrapper for the Kendo UI Notification.

It allows you to configure the Kendo UI Notification widget from server-side code. The Notification provides a styled UI widget with arbitrary content, which can provide information to the user on various occasions.

For more information on the HtmlHelper, refer to the article on the Notification HtmlHelper for ASP.NET MVC.

Basic Usage

The following example demonstrates how to define the Notification by using the Notification HtmlHelper.

Example

   @(Html.Kendo().Notification()
        .Name("notification")
    )

    <script type="text/javascript">
        $(document).ready(function () {
            var popupNotification = $("#notification").data("kendoNotification");

            popupNotification.show("Test popup message", "info");                        
        });
    </script>

Configuration

The following example demonstrates the basic configuration of the Notification HtmlHelper and how to get the Notification instance.

    @(Html.Kendo().Notification()
        .Name("notification")
        .Stacking(NotificationStackingSettings.Down)
        .Width("12em")
        .Height(200)
        .HideOnClick(false)
        .Events(ev => ev.Show("onShow").Hide("onHide"))
        .Templates(t =>
        {
            t.Add().Type("time").ClientTemplate("<div style='padding: .6em 1em'>Time is: #: time #</div>");
        })
        .Button(true)
    )

    <script type="text/javascript">
        $(function () {
            //Notice that the Name() of the Notification is used to get its client-side instance.
            var notification = $("#notification").data("kendoNotification");
            console.log(notification);
        });
    </script>

See Also