Keep in mind that there are several different ways to implement such a versatile control like this one, so what I’m going to be presenting here should be more seen as a first look at the control, more advanced scenarios can be found in our online documentation and demos, and will most likely be covered in a later blog post.
The RadNotification control can be found in the Telerik Container Controls section of the Visual Studio Toolbox. Dragging the control over to your form sets up the very basic properties, id and runat, so if you are manually working with the control you will have to set these up. Now you can really start to experiment a bit with all of the various properties, but I’m going to just focus on how you can get your first message displayed in the notification control.
First, since I want the message to be displayed when I initially load my page I set the VisibleOnPageLoad property to “true”. I of course also want to have some text displayed in the control I set the Text property to “First Notification!”. If I decided to run this application I would actually get a small notification window in the bottom right-hand corner of my window.
The markup that has gone into this is the following:
Not too bad. Of course, this doesn’t really do much. The control is initially displayed and then eventually goes away. Let’s change the behavior a bit.
We have the ability to define the Position property of the control, which designates where the notification is supposed to appear. The valid settings (don’t worry, they appear with intellisense) are: BottomCenter, BottomLeft, BottomRight, Center, MiddleLeft, MiddleRight, TopCenter, TopLeft, and TopRight. All of these are pretty self-explanatory but by default the BottomRight will be used if no other position is specified.
We can also play around with the various animations available. The Animation property can have the following set: None, Resize, Fade, Slide, and FlyIn. These are again easy to figure out what they do, but they have to do with how the control appears and disappears. In the case that I have above, where I load the page initially on the page, the animation will not be displayed since it is on the page on initial rendering. We can also define the duration of this animation by setting the AnimationDuration property. This should be defined in milliseconds and gives full control over just how long it takes to show and hide the control.
So, an example of using all of the properties above would be:
Content Via Callback
So we have taken a look at how to set up content initially on every load via markup, but what if we want to go back to the server to grab some data and place that in our notification window? Well, the OnCallbackUpdate event is exactly what we’re looking for. In order to have this event be fired we also need to set the LoadContentOn property. The later property is the key here, as it defines when the content will be loaded to the control. We can set this to: EveryShow, FirstShow, PageLoad, and TimeInterval. So, using PageLoad essentially has the control working like it did above, only we are going to end up back on our server (using C# or VB.NET) when the page loads. TimeInterval allows us to define a certain time interval (in milliseconds) where this event will be fired. EveryShow and FirstShow are a little different. These rely on the ShowInterval property, which is again a property to be given a millisecond parameter. If we select EveryShow our event will be triggered every time the ShowInterval time has passed. FirstShow will only raise the event the first time the control is being displayed. What does this look like when actually implemented? Well, let’s take a look at some code.
sender, RadNotificationEventArgs e)
"This was set on the server"
With the settings I have provided the code in my RadNotification1_CallbackUpdate event will be executed every time the control is going to be displayed, which according to the ShowInterval is every five seconds. Also, take note of the RadNotificationEventArgs type, which replaces the default EventArgs type. There are of course some better things to do in this event than simply provide a string to be placed as the text, but you get the overall idea of how to use this to your advantage.
So now you’ve seen some quick usages of the RadNotification control. There are more advanced scenarios in which this control can be used, but this gives a basic idea of what exactly the control is, and how it can be implemented. There are more examples available in both our online demos as well as documentation, so I highly recommend taking a look at those two resources once you start working with the control!
Carl Bergenhem is an Enterprise Solutions Consultant at Telerik specializing in the ASP.NET AJAX and ASP.NET MVC products. He has always been interested in web development and has played around with various web technologies since he was a kid. In his free time Carl enjoys soccer, running and playing his guitar.
Copyright © 2017, Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved.
Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries. See Trademarks or appropriate markings.