change radwindow border from client-side

[Raymond Mui]

Hi,

Is it possible to change the radwindow's border color (and other settings) from client-side?  I cannot change it from server-side, because I followed the article "Opening a RadWindow from Within a RadWindow" to reference the parent's RadWindow.

Thanks

Raymond

[Georgi Tunev]

Hi Raymond,

Could you please provide more details on what exactly you want to achieve?


Greetings,
Georgi Tunev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Jittu]

I am unable to change the border of RadWIndow by setting its property and even applying the CSS file

[Princy]

Hi Jittu,

Try overriding the default CSS as follows to achieve your scenario.

CSS:

<style type="text/css">
   .RadWindow .rwCorner
        {
            width: 10px !important;
             /* some color to show the behavior */
            background-color: Red !important;
             /* the custom sprite + custom positioning */
            background-image: url('my_custom_sprite') !important;
            background-position: 50px 50px !important;
        }
   .rwTitlebar, .rwFooterCenter
        {
            height: 10px !important;
             /* some color to show the behavior */
            background-color: Red !important;
             /* the custom sprite + custom positioning */
            background-image: url('my_custom_sprite') !important;
            background-position: 50px 50px !important;
        }
</style>

Hope this helps.

Regards,
Princy.

[Jittu]

Thanks for your response princy.
Actually I have tried using that but its not working. It only applies the Red color on the right side of the Title bar and all the corners  , I need to change the back ground color of the window too. thats my RadWindow code

<telerik:RadWindow ID="radwindowPopup" runat="server" VisibleOnPageLoad="false" Height="550px" Width="550px" 
     Animation="None"  VisibleStatusbar="false"  Behaviors="Close, Move,Maximize" Title="XXX"
     KeepInScreenBounds="true">
     
</telerik:RadWindow>

[Princy]

Hi Jittu,

Try overriding the default CSS as follows to achieve your scenario.

CSS:

<style type="text/css">
      .RadWindow .rwCorner,.rwTopResize
        {
            width: 10px !important; /* some color to show the behavior */
            background-color: Red !important; /* the custom sprite + custom positioning */
            background-image: url('my_custom_sprite') !important;
            background-position: 50px 50px !important;
        }
      .rwTitlebar, .rwFooterCenter
        {
            height: 10px !important; /* some color to show the behavior */
            background-color: Red !important; /* the custom sprite + custom positioning */
            background-image: url('my_custom_sprite') !important;
            background-position: 50px 50px !important;
        }
      .RadWindow .rwWindowContent
        {
            background-color:Gray !important;
        }
</style>

Hope this helps.

Regards,
Princy.

[Jittu]

Thanks princy for the reply . Its working now.
I need one more help from you .. I need to change the color of just the top of the Title Bar and also the corner should curved.

[Princy]

Hi Jittu,

Try Overriding the default CSS as follows to achieve your scenario.

CSS:

<style type="text/css">
   .rwTopResize
    {
        background-image: url('my_custom_sprite') !important;
    }
    .rwTopLeft
    {
        border-top-left-radius: 10px 5px !important;
    }
    .rwTopRight
    {
        border-top-right-radius: 10px 5px !important;
    }
    .rwFooterLeft
    {
        border-bottom-left-radius: 10px 5px !important;
    }
    .rwFooterRight
    {
        border-bottom-right-radius: 10px 5px !important;
    }
</style>

Thanks,
Princy.

[Gayathri]

Hi All,

 

I have a radwindow css like this.

.ManageRadWindowCSS .rwCorner .rwTopLeft,  
.ManageRadWindowCSS .rwTitlebar,  
.ManageRadWindowCSS .rwCorner .rwTopRight,  
.ManageRadWindowCSS .rwIcon, 
.ManageRadWindowCSS table .rwTopLeft,  
.ManageRadWindowCSS table .rwTopRight,  
.ManageRadWindowCSS table .rwFooterLeft,  
.ManageRadWindowCSS table .rwFooterRight,  
.ManageRadWindowCSS table .rwFooterCenter,  

.ManageRadWindowCSS table .rwTitlebar,  
.ManageRadWindowCSS table .rwTopResize, 
.ManageRadWindowCSS table .rwStatusbar, 
.ManageRadWindowCSS table .rwStatusbar .rwLoading 
    {    
        display:  none !important;   
    }​

 

 <telerik:RadWindow ID="ManageWindow" CssClass="ManageRadWindowCSS"  runat="server" Width="600px" Height="620px" 
                BackColor="#3D6AA2" AutoSize="false" BorderStyle="None"   BorderWidth="1px"          
                OnClientClose="windowOnClientClose" Modal="true"  VisibleStatusbar="false" VisibleTitlebar="false"  
                KeepInScreenBounds="true" Title="" NavigateUrl="ManageSite.aspx" Behaviors="Close" >

    </telerik:RadWindow>

I am not able to set the border colour to Gray. Can you please advise on this?

 ​