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

Close modal on overlay click

8 Answers 111 Views
Window
This is a migrated thread and some comments may be shown as answers.
Fit2Page
Top achievements
Rank 1
Iron
Veteran
Iron
Fit2Page asked on 27 Aug 2010, 09:33 AM
Is it possible to close the modal by clicking the overlay?

Something like you see with other modal scripts:

overlayClose: true | false Close modal box by clicking on overlay. Default is true.

Marc

8 Answers, 1 is accepted

Sort by
0
Accepted
Georgi Tunev
Telerik team
answered on 27 Aug 2010, 12:07 PM
Hi Marc,

Here is one way to do that:

<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="ScriptManager1">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
    </Scripts>
</asp:ScriptManager>
<telerik:RadWindow ID="RadWindow1" runat="server" VisibleOnPageLoad="true" Modal="true"
    OnClientShow="OnClientShow">
</telerik:RadWindow>
<script type="text/javascript">
 
    function OnClientShow(sender, args)
    {
        //use telerik's static client library to get a reference to the modal overlay object
        var overlay = $telerik.getElementByClassName(document, "TelerikModalOverlay");
        overlay.onclick = function ()
        {
            sender.close();
        }
    }
    
</script>
</form>

I hope this helps.

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
Kees
Top achievements
Rank 1
answered on 19 Jun 2013, 01:53 PM
So how do I do this when VisibleOnPageLoad = false?
$telerik.getElementByClassName(document, "TelerikModalOverlay") will not give me a reference in that case.

Greetings,
Kees.
0
Ivaylo
Telerik team
answered on 20 Jun 2013, 12:21 PM
Hello Kees,

I have already replied to the support ticket that you have opened regarding the same issue.

For convenience I am also pasting my response here:

We have tested the described scenario and tried to replicate the issue, but without success. I have prepared a sample project with a window manager with the same properties that you have defined and one child window. VisibleOnPageLoad property is set to false, however, the problem that you are experiencing is not being reproduced on our side.

I am also attaching a video illustrating the behavior observed by us. As you can see, the window always gets closed by clicking on the overlay.

Could you, please, run the project that I have prepared and see whether the issue occurs in it as well? If not, we would need to ask you for a sample fully-runnable project isolating the problem, so that we can conduct further investigation.

We will be expecting your feedback in case the problem persists.

Regards,
Ivaylo
Telerik
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 the blog feed now.
0
Kees
Top achievements
Rank 1
answered on 20 Jun 2013, 01:32 PM
Hello Ivaylo,

Thanks for your quick reply.
The example you send me made me realize that i'm not starting a predefined radwindow. 
I have set the windowmanager and use radopen to create a new window without specifying a specific window id.
In that scenario the problem that I described is true.
When id do predefine a specific window and start this one (in the second argument from radopen) then everything works as expected.

Problem solved!
Thanks again for your adequate reaction.

Best regards,
Kees van der Velden.

0
miksh
Top achievements
Rank 1
Iron
answered on 02 Jun 2014, 07:48 PM
How to do it now - as of June 2014?

The code var overlay = $telerik.getElementByClassName(document, "TelerikModalOverlay"); returns null.
0
Marin Bratanov
Telerik team
answered on 03 Jun 2014, 11:20 AM

Hello,

The first thing I can suggest is trying a small timeout.

You may also find useful this code library entry: http://www.telerik.com/support/code-library/close-the-radwindow-object-on-click-outside-the-window.

I am also attaching here a sample that goes through the inner properties of each RadWidow to connect it to its modal background element so clicking it will close the concrete instance. This can be helful if you work with multiple RadWindow instances.


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.

 
0
miksh
Top achievements
Rank 1
Iron
answered on 03 Jun 2014, 01:35 PM
Thanks, it works fine!

Nowadays, this seems to be a common feature for popup windows so I'm surprized that it is still not a part of radWindow.
Please consider to add it (a property?) to make it simple.
0
Marin Bratanov
Telerik team
answered on 03 Jun 2014, 03:18 PM

Hello,

I have added your request to our feedback portal: http://feedback.telerik.com/Project/108/Feedback/Details/130001-add-close-on-outside-click-feature-for-radwindow. You can use this page to vote, leave a comment and track the idea's progress.


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.

 
Tags
Window
Asked by
Fit2Page
Top achievements
Rank 1
Iron
Veteran
Iron
Answers by
Georgi Tunev
Telerik team
Kees
Top achievements
Rank 1
Ivaylo
Telerik team
miksh
Top achievements
Rank 1
Iron
Marin Bratanov
Telerik team
Share this question
or