Hello,
I wonder If somebody knows how to create center align button in RadAlert ? I've tried some css tricks (.rwpopupbutton class) but without success :(
In the attachment there is a picture which describes my request:
Red rounded rectangle shows standard position of button.
Green rounded rectangle is what I need to achieve.
Could you help me please to solve this issue ?
Best regards
Vasssek
I wonder If somebody knows how to create center align button in RadAlert ? I've tried some css tricks (.rwpopupbutton class) but without success :(
In the attachment there is a picture which describes my request:
Red rounded rectangle shows standard position of button.
Green rounded rectangle is what I need to achieve.
Could you help me please to solve this issue ?
Best regards
Vasssek
6 Answers, 1 is accepted
0
Princy
Top achievements
Rank 2
answered on 19 Aug 2010, 03:13 PM
Hello,
One suggestion to apply css to align the button. Set appropriate value for margin-left in order to center the button properly.
Style:
Thanks,
Princy.
One suggestion to apply css to align the button. Set appropriate value for margin-left in order to center the button properly.
Style:
<style type=
"text/css"
>
.rwPopupButton
{
margin-left
:
30px
!important
;
}
</style>
Thanks,
Princy.
0
Vasssek
Top achievements
Rank 1
answered on 19 Aug 2010, 06:00 PM
Hmm,
I considered this option, but I called RadAlert with parameters (width, height), that's way the RadAlert has each time different width.
So your solution can be used just for static radalert width, which is not my case :-(
Maybe it can be done via javascript, get radalert window width then dynamically change margin position of popupbutton...
Do you have some idea or example how to do it ?
I really appreciate your help...
Have a nice day.
Vasssek
I considered this option, but I called RadAlert with parameters (width, height), that's way the RadAlert has each time different width.
So your solution can be used just for static radalert width, which is not my case :-(
Maybe it can be done via javascript, get radalert window width then dynamically change margin position of popupbutton...
Do you have some idea or example how to do it ?
I really appreciate your help...
Have a nice day.
Vasssek
0
Hi Vasssek,
Currently RadWindowManager's confirm, prompt and alert popups do not support repositioning of the content elements (based on the size of the popup) out of the box. The content templates for these dialogs are pure HTML and you can try achieving the desired result with a custom structure and CSS. More information on RadWindowManager's templates is available here.
Kind regards,
Georgi Tunev
the Telerik team
Currently RadWindowManager's confirm, prompt and alert popups do not support repositioning of the content elements (based on the size of the popup) out of the box. The content templates for these dialogs are pure HTML and you can try achieving the desired result with a custom structure and CSS. More information on RadWindowManager's templates is available here.
Kind regards,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Public Issue Tracking
system and vote to affect the priority of the items
0
Vasssek
Top achievements
Rank 1
answered on 22 Oct 2010, 07:02 AM
Hello,
I've solved my problem how to center OK button in Rad alert via jquery. Maybe it will be useful for somebody else :-))
Server side code:
alertmessage = "U tejto objednávky už bol vykonaný schvaľovacà proces na úrovni<
br
/> <
br
/>";
titlemessage = "Warning";
ScriptManager.RegisterStartupScript(this, this.GetType(), "myKey", "AlertMessage('" + alertmessage + "',270,160,'" + titlemessage + "');", true);
Client side code:
<
script
type
=
"text/javascript"
>
function AlertMessage(message, width, height, title) {
var oWnd = radalert(message, width, height, title);
CenterItem('.rwDialogPopup','.rwDialogText','.rwPopupButton');
}
function CenterItem(parentItem, subparentItem, theItem) {
var parentWidth = $telerik.$(parentItem).outerWidth();
var subparentWidth = $telerik.$(subparentItem).outerWidth();
var itemWidth = $telerik.$(theItem).outerWidth();
var theCenter = parentWidth / 2 - (parentWidth - subparentWidth) - itemWidth / 2;
if (theCenter>0) $telerik.$(theItem).css('margin-left', theCenter);
else $telerik.$(theItem).css('margin-left', '0');
}
</
script
>
The result is in the attachments...
Best regards
Vasssek
0
Accepted
sherin george
Top achievements
Rank 1
answered on 04 Jan 2011, 04:57 AM
Hi all,
Thanks to Vasssek in the first place for providing the script.
A modified version of the above script may be written as below. This has two improvements
a) Support for the radconfirm (the last parameter will need to pass the Boolean value indicating it is a radconfirm or not)
b) The style changes have been done on the parent div where the button appears. This will make the buttons grouped together always
function CenterItem(parentItem, subparentItem, theItem, isRadConfirmShown) {
var parentWidth = $telerik.$(parentItem).outerWidth();
var subparentWidth = $telerik.$(subparentItem).outerWidth();
var itemWidth = $telerik.$(theItem).outerWidth();
var theCenter = parentWidth / 2 - (parentWidth - subparentWidth) - itemWidth / 2;
if ($telerik.$(theItem).length > 0) {
if (theCenter <= 0) {
theCenter = 0;
}
else {
if (isRadConfirmShown) theCenter -= 20;
}
$telerik.$(theItem)[0].parentNode.style.paddingTop = "6px";
$telerik.$(theItem)[0].parentNode.style.paddingLeft = theCenter + "px";
}
}
As jquery is already embedded in the radcontrols script files no need to add it separately.
Best Regards,
Sherin
Thanks to Vasssek in the first place for providing the script.
A modified version of the above script may be written as below. This has two improvements
a) Support for the radconfirm (the last parameter will need to pass the Boolean value indicating it is a radconfirm or not)
b) The style changes have been done on the parent div where the button appears. This will make the buttons grouped together always
function CenterItem(parentItem, subparentItem, theItem, isRadConfirmShown) {
var parentWidth = $telerik.$(parentItem).outerWidth();
var subparentWidth = $telerik.$(subparentItem).outerWidth();
var itemWidth = $telerik.$(theItem).outerWidth();
var theCenter = parentWidth / 2 - (parentWidth - subparentWidth) - itemWidth / 2;
if ($telerik.$(theItem).length > 0) {
if (theCenter <= 0) {
theCenter = 0;
}
else {
if (isRadConfirmShown) theCenter -= 20;
}
$telerik.$(theItem)[0].parentNode.style.paddingTop = "6px";
$telerik.$(theItem)[0].parentNode.style.paddingLeft = theCenter + "px";
}
}
As jquery is already embedded in the radcontrols script files no need to add it separately.
Best Regards,
Sherin
0
Roberto
Top achievements
Rank 1
answered on 30 Dec 2011, 11:51 AM
Great!
Fantastic job
Thanks
Fantastic job
Thanks