[Solved] MVC Window opening behind Java applet (Chrome/IE)

[Trevor]

I have a view in my application in which a MVC Window, which contains some text and an MVC Editor control, must be displayed modally along with a Java applet that runs in the view.  However, when the window is displayed in Chrome 16 or IE 9, the entirety of the window with the exception of the MVC Editor is obscured behind the Applet.  (This includes the titlebar; if the entirety of the titlebar is obscured by the applet, the user cannot move or close the window, and because the window is modal, the rest of the page is unavailable to the user unless the reload the page.)

I have attached a screenshot showing how this bug manifests itself.  In Firefox 9, the titlebar and window (with the exception of the rounded corners and blurred borders) are shown correctly.

In the ASP.NET AJAX Window, the .Overlay property was supposed to circumvent this kind of problem.  No .Overlay property exists in the MVC Window, and the closest I could find (including ".Effects(builder => builder.Overlay())" in the chain of calls that render the window) has no effect on the problem.  Is this a known bug in the MVC Window, and if so, is there an established workaround?

For reference, here is the full .Render() function call chain:

Html.Telerik().Window()
                .Name("PopupWindow")
                .Title("Reset Assessment Reason")
                .Content(() =>
                {%>
                    <% using (Html.BeginForm("Action", "Controller", new { id = Model.Id }, FormMethod.Post, new {name = "formPopup", id="formPopup"}))
                       { %>
                        <p>Please enter a reason for resetting this assessment.</p>
                        <p>
                            The text that you enter will be sent along
                            with a notification email to both the student and Guide email addresses associated with this account.
                        </p>
                        <%= Html.Telerik().Editor()
                                .Name("ResetComments")
                                .Encode(true)
                                .Tools(tools => tools
                                    .Clear()
                                    .Bold().Italic().Separator()
                                    .InsertOrderedList().InsertUnorderedList().Separator()
                                    .CreateLink()
                                )%>
                        <p> </p>
                        <button id="submit-form-button" type="submit">Send notification</button>
                    <% } %>
                <%})
                .Effects(builder => builder.Opacity())
                .Width(600)
                .Draggable(true)
                .Modal(true)
                .Buttons(b => b.Maximize().Close())
                .Visible(false)
                .Render();

Thanks in advance.

[Alex Gyoshev]

Hello Trevor,

Overlaying applets is not supported by the window. There are several work-around methods known (usually overlaying the applet with a frame), but the most painless would be to hide the applet when the window opens and show it when the window closes. If that is not satisfactory, refer to the following post: how to display <div> over a Java applet in Chrome.

Greetings,
Alex Gyoshev
the Telerik team