I need, if possibile, an example of how to add an "OK" button inside a notification to close it (instead of using the X on the top right corner).
I'm playing around with it, but it doesn't work.
Thank you.
5 Answers, 1 is accepted
Try the following code to achieve your scenario.
ASPX:
<telerik:RadNotification ID=
"RadNotification1"
runat=
"server"
Title=
"Sample Title"
Text=
"Simple text content"
VisibleOnPageLoad=
"true"
AutoCloseDelay=
"0"
ShowCloseButton=
"false"
>
<ContentTemplate>
<telerik:RadButton ID=
"btnOk"
runat=
"server"
AutoPostBack=
"false"
Text=
"OK"
OnClientClicked=
"OnClientClicked"
></telerik:RadButton>
</ContentTemplate>
</telerik:RadNotification>
JS:
<script type=
"text/javascript"
>
function
OnClientClicked(sender, args)
{
var
notification = $find(
"<%=RadNotification1.ClientID %>"
);
notification._close(
true
);
}
</script>
Hope this helps.
Thanks,
Shinu.
AutoPostBack=
"false"
on the button does not help
Thanks
If you do not want the button to postback you need to write some JavaScript to execute the desired logic. If neither a JavaScript function is called, nor a postback is initiated there isn't a way for a button to provide any interaction.
The correct way to close the notification would be through its hide() method, too.
Also, the control offers a [x] button in its titlbar that can be used to close it. It can be enabled through the ShowCloseButton property.
Regards,
Marin Bratanov
the Telerik team
When I tried the coded provided, after adding the <ContentTemplate> I am loosing all the Text set on the RadNotification.
Here is my code:
<telerik:RadNotification ID="ErrorMessage" runat="server" Text="User groups are limited to 500 users." Position="Center" AutoCloseDelay="0" Width="200" Title="Error" ContentIcon="/MedManager/images/Dialogs/error_sm.png">
<ContentTemplate>
<telerik:RadButton ID="btnOk" runat="server" AutoPostBack="false" Text="OK" OnClientClicked="OnClientClicked"></telerik:RadButton>
</ContentTemplate>
</telerik:RadNotification>
function OnClientClicked(sender, args) {
var notification = $find("<%=ErrorMessage.ClientID %>");
notification._close(true);
}
Thank you
Hello Diego,
I have answered your support ticket on the matter and I am pasting my response here for anyone else having the same question:
This behavior is expected. The built-in text and content icon are available in the simplest scenario. If the developer wants to have a custom layout in the control, the ContentTemplate provides freedom do to that without built-in styles. You can see that here: http://demos.telerik.com/aspnet-ajax/notification/examples/settingcontent/defaultcs.aspx .
What I can suggest are the following approaches:
- use the built-in close button on the titlebar of the notification, if possible. It is visible by default and will not require the use of a ContentTemplate.
-
OR, add a literal or label where you can set the desired text. It seems you have your custom icon for the ContentIcon so you can use a simple image element for it. Anyway, If you want to have an icon from the built-in ones, you have two options:
- get the icons from the installation (e.g.: C:\Program Files (x86)\Telerik\UI for ASP.NET AJAX Q3 2014\Skins\Black\Notification ) and trim them to include only the large icon, then use them like any other images asset
- use the approach from this KB to set the URL of the icon to a custom icon: http://www.telerik.com/support/kb/aspnet-ajax/notification/details/using-the-built-in-icons-with-a-custom-skin . Note that the SItefinity skin is no longer available, so you should replace it with another skin name.
On a side note - the recommended way to close the notification is by calling its hide() method and not the "private" _close() method: http://www.telerik.com/help/aspnet-ajax/notification-client-side.html .
Regards, Marin Bratanov
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.