This is a migrated thread and some comments may be shown as answers.

Modal Implementation

5 Answers 273 Views

Window

This is a migrated thread and some comments may be shown as answers.

5 Answers, 1 is accepted

answered on 15 Dec 2008, 02:18 PM

Hi Michael,

Here is how to do it - note the !important directive in the CSS. It is needed because you have to override the predefined color:

    
            <head runat="server"> 
        
                <title>Untitled Page</title> 
        
                <style type="text/css"> 
        
                    .TelerikModalOverlay 
        
                    { 
        
                        background-color: red !important; 
        
                    } 
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
        
                    </asp:ScriptManager> 
        
                    <script type="text/javascript"> 
        
                        function openWin() 
        
                        { 
        
                            radopen("http://www.google.com", "RadWindow1");  
        
                        } 
        
                        function openAlert() 
        
                        { 
        
                            radalert("alert message");  
        
                        } 
        
                    </script> 
        
                    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Modal="true"> 
        
                    </telerik:RadWindowManager> 
        
                    <button onclick="openWin(); return false;"> 
        
                        open RadWindow</button> 
        
                    <br /> 
        
                    <button onclick="openAlert(); return false;"> 
        
                        open radalert</button> 
        
                </form>

Best wishes,
Georgi Tunev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

answered on 15 Dec 2008, 03:48 PM

The issue I am having is using a previous verison of the RadWindowManager.

    
            <radW:RadWindowManager runat="server" ID="rwmDefault" VisibleStatusbar="false" Modal="true">  
        
            </radW:RadWindowManager>

I am guessing that the CSS that this version is looking for is different then .TelerikModalOverlay? I was unable to identify this change through your documentation on past version. If you could post that difference that would be most appreciated.

The other issue I am having is when model is set to true the window is pushed down and left. The top and left settings are disabled - how do you override the placement of the window?

answered on 16 Dec 2008, 03:33 PM

ModalRadWindow.png

Hello Michael,

Yes, if you are using RadWindow for ASP.NET, .RadWModalImage is the class that you need - I apologize for the confusion.

The logic however, stays the same with the previous version as well - the code below produces the result that you can see in the attached screeenshot:

    
            <%@ Register Assembly="RadWindow.Net2" Namespace="Telerik.WebControls" TagPrefix="rad" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
                <title>Untitled Page</title> 
        
                <style type="text/css"> 
        
                .RadWModalImage 
        
                { 
        
                    background-color: red !important;  
        
                } 
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                    <rad:RadWindowManager runat="server" ID="rwmDefault" VisibleStatusbar="false" Modal="true"> 
        
                    </rad:RadWindowManager> 
        
                    <button onclick="radopen('http://www.google.com','RadWindow1'); return false;"> 
        
                        open window</button> 
        
                </form> 
        
            </body> 
        
            </html>

Please open a support ticket and send me a sample project where the problem that you experience can be reproduced. I will check it right away.

Greetings,
Georgi Tunev
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.