Hi, everybody
Im still new to Telerik Controls, so sorry for dumb questions.
Anyway is there some Css hack or another way to set icon in simple radalert javascript function? I would like to have several types of messages in my project. And exclamation mark is not appropriat, when opertaion finish successfully.
Thanks!
Im still new to Telerik Controls, so sorry for dumb questions.
Anyway is there some Css hack or another way to set icon in simple radalert javascript function? I would like to have several types of messages in my project. And exclamation mark is not appropriat, when opertaion finish successfully.
Thanks!
12 Answers, 1 is accepted
0
Shinu
Top achievements
Rank 2
Rank 2
answered on 10 Nov 2009, 07:23 AM
Hello Jan,
Try adding following CSS in order to change the radalert icon.
CSS:
Regards,
Shinu.
Try adding following CSS in order to change the radalert icon.
CSS:
| <style type="text/css"> |
| .RadWindow .rwWindowContent .radalert |
| { |
| background-image: url(../../Images/AddRecord.gif) !important; |
| } |
| </style> |
Regards,
Shinu.
0
Hi Jan,
if you want to change the exclamation sign in the alert box rather than the icon of the window you may use the following CSS:
.rwDialogPopup.radalert
{
background: url('CutomExclamation.gif') no-repeat left center !important;
}
Sincerely yours,
Georgi Tunev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
if you want to change the exclamation sign in the alert box rather than the icon of the window you may use the following CSS:
.rwDialogPopup.radalert
{
background: url('CutomExclamation.gif') no-repeat left center !important;
}
Sincerely yours,
Georgi Tunev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Jan
Top achievements
Rank 1
Rank 1
answered on 10 Nov 2009, 03:24 PM
Hi,
thanks for reply, could i change it with JavaScript, or show rad alert with special css class? Because when i set the css class its for whole app and is bit complicated to render css rules dynamically in header every time i want to show custom header.
something like
and css:
thanks for reply, could i change it with JavaScript, or show rad alert with special css class? Because when i set the css class its for whole app and is bit complicated to render css rules dynamically in header every time i want to show custom header.
something like
| radalert('Everything is ok', 'information'); |
and css:
| .information .rwDialogPopup.radalert |
| { |
| background: url('/images/popup-information.gif') no-repeat left center !important; |
| } |
0
Accepted
Hello Jan,
Yes, this is possible:
Kind regards,
Georgi Tunev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Yes, this is possible:
<title></title><style> .newStyle { background: url('CutomExclamation.gif') no-repeat left center !important; }</style></head><body><form id="form1" runat="server"><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><telerik:RadWindowManager ID="RadWindowManager1" runat="server"></telerik:RadWindowManager><script type="text/javascript"> function showModifiedAlert() { var oWnd = radalert("message"); var content = oWnd.get_contentElement().getElementsByTagName("DIV"); for (var i in content) { if (content[i].className == "rwDialogPopup radalert") { content[i].className += " newStyle"; } } }</script><button onclick="showModifiedAlert(); return false;"> test</button></form>Kind regards,
Georgi Tunev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
sravanthi
Top achievements
Rank 1
Rank 1
answered on 27 Aug 2010, 06:52 PM
I need to change the radalert image .But I am calling the radalert in code behind.I am not able to change the Image.
I had written it like this:(It doesnot work like this)
C#:
string
radalertscript = "<script language='javascript'>function f(){var ownd=radalert('<b> Record has been saved </b>', 150, 150); var content = oWnd.get_contentElement().getElementsByTagName('DIV');for(var i in Content){if (content[i].className == 'rwDialogPopup radalert'){content[i].className += ' newStyle';}Sys.Application.remove_load(f);}; Sys.Application.add_load(f);</script>";
Page.ClientScript.RegisterStartupScript(
this.GetType(), "radalert", radalertscript);
.aspx
<
style type="text/css">
.newStyle
{
background: url('/App_Themes/Default/Images/army_seal2.gif') no-repeat left center !important;
}
</
style>
<
asp:Content ID="Content2" ContentPlaceHolderID="cphBody" runat="server">
<telerik:RadWindowManager ID="RadWindowManager1" runat="server">
</telerik:RadWindowManager>
</asp:Content>
When i did it like this it works(but here the default image occurs)
C#:
| protected void Button1_Click(object sender, EventArgs e) |
| { |
| string radalertscript = "<script language='javascript'>function f(){radalert('Welcome to RadWindow <b>Prometheus</b>!', 330, 210); Sys.Application.remove_load(f);}; Sys.Application.add_load(f);</script>"; |
| Page.ClientScript.RegisterStartupScript(this.GetType(), "radalert", radalertscript); |
| } |
Can Any one help me with this.
Thanks,
Sravanthi.
0
Erik
Top achievements
Rank 1
Rank 1
answered on 16 Jan 2012, 05:53 PM
Would it be possible to get a working example of this?
0
Hello Erik,
I am attaching a simple example that uses an even simpler approach to change the RadAlert icon - it adds a custom CSS class to the needed RadAlert so that your stylesheet can cascade through it and override the default icon: http://screencast.com/t/PUCd0Vc7bRq. I hope this helps you incorporate this functionality in your project. If you need to call it from the code-behind what I can suggest is that you inject the call to this JavaScript function from the code-behind as explained here.
Regards,
Marin
the Telerik team
I am attaching a simple example that uses an even simpler approach to change the RadAlert icon - it adds a custom CSS class to the needed RadAlert so that your stylesheet can cascade through it and override the default icon: http://screencast.com/t/PUCd0Vc7bRq. I hope this helps you incorporate this functionality in your project. If you need to call it from the code-behind what I can suggest is that you inject the call to this JavaScript function from the code-behind as explained here.
Regards,
Marin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Erik
Top achievements
Rank 1
Rank 1
answered on 17 Jan 2012, 03:31 PM
thank you very much, Marin! This way works great!
Would i change it the same way if i wanted to remove the top window icon that appears on the close bar of the alert? Since it is Green, it doesn´t really go with my design, so I´d like to remove it altogether.
How would the CSS look like?
Would i change it the same way if i wanted to remove the top window icon that appears on the close bar of the alert? Since it is Green, it doesn´t really go with my design, so I´d like to remove it altogether.
How would the CSS look like?
0
Princy
Top achievements
Rank 2
Rank 2
answered on 18 Jan 2012, 07:07 AM
Hello,
Try the following CSS.
CSS:
Thanks,
Princy.
Try the following CSS.
CSS:
<style type="text/css"> .rwIcon { display:none !important; }</style>Thanks,
Princy.
0
Naren
Top achievements
Rank 1
Rank 1
answered on 07 Dec 2012, 04:02 PM
HI Telrik team,
can u please post the sample code for changing the icon thru codebehind.
can u please post the sample code for changing the icon thru codebehind.
string
ImageUrl = "~/Images/Hours.png";
string radalertscript = "<script language='javascript'>function f(){radalert('" + displaymessage + "', 330, 210,'CUSTOM ALERT',,'" + ImageUrl + '"); Sys.Application.remove_load(f);}; Sys.Application.add_load(f);</script>";
Page.ClientScript.RegisterStartupScript(
this.GetType(), "radalert", radalertscript);
0
Hello Naren,
Since Q1 2012 this functionality is built in the dialogs, so you can simply pass the URL to your image as the last argument in the radalert() function. This goes for both the client-side and server-side methods. More information on the arguments the function takes and how to modify the images is available in the following resources:
http://www.telerik.com/help/aspnet-ajax/window-dialogs-alert.html
http://demos.telerik.com/aspnet-ajax/window/examples/browserdialogboxes/defaultcs.aspx
All the best,
Marin Bratanov
the Telerik team
Since Q1 2012 this functionality is built in the dialogs, so you can simply pass the URL to your image as the last argument in the radalert() function. This goes for both the client-side and server-side methods. More information on the arguments the function takes and how to modify the images is available in the following resources:
http://www.telerik.com/help/aspnet-ajax/window-dialogs-alert.html
http://demos.telerik.com/aspnet-ajax/window/examples/browserdialogboxes/defaultcs.aspx
All the best,
Marin Bratanov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Naren
Top achievements
Rank 1
Rank 1
answered on 10 Dec 2012, 12:29 PM
HI Telrik team ,
thx i am able to resolve the isssue.
Regards!
--Naren
thx i am able to resolve the isssue.
Regards!
--Naren