Telerik Notification Message background in red color instead of blue

21 Views Asked by At

I am trying to display Telerik Notification in .net Core. The notification message is passed from the controller. Notification is displaying correctly. The only issue is that I want the background color or the notification to be red instead of blue. Below is my View code:

<div>
        @(Html.Kendo().Notification()
            .Name("notification")
            .Position(p => p.Pinned(true).Top(30).Right(30))
            .HideOnClick(true)
            .AutoHideAfter(0)
            .Width(300)
                  

                    )


    </div>

<script type="text/javascript">

    $(document).ready(function () {
        var notification = $("#notification").data("kendoNotification"); //Get a reference to the Notification component
        var msg = '@Html.Raw((string)TempData["Message"])';//Get the message from the Model
        if (notification) {
            notification.show(msg); //Show the Notification with the respective message
        }
    });
    </script>

Below is my Controller code

   public async Task<IActionResult> Index()
   {
      string Message ="This is an error";
      TempData["Message"] = "This error needs to be displayed in the View";
   }

I tried to put the kendo template in the Kendo notification control, but that did not work. below is what I tried to do:

 @(Html.Kendo().Notification()
            .Name("notification")
            .Position(p => p.Pinned(true).Top(30).Right(30))
            .HideOnClick(true)
            .AutoHideAfter(0)
            .Width(300)
                    .Templates(t =>
                    {
                        t.Add().Type("error").ClientTemplateID("errorTemplate");
                    })

                    )

Added errorTemplate so that the color changes to red.

.Templates(t =>
                        {
                            t.Add().Type("error").ClientTemplateID("errorTemplate");
                        })
    
                        )

After I added Templates, notification totally stopped displaying.

0

There are 0 best solutions below