[Solved] 2 Pop-ups, Controlling display order

[MarkInTexas]

Hi there,

I have a page with 2 pop-ups. Lets call them window1 and window2. window1 is non-modal and window2 is modal. If window1 is already displayed and I invoke window2 via server side code window2 displays behind window1 even though window2 is modal and window1 is non-modal.

If I click on window2  then window1 and main page now become disabled till I close window2. This is expected behavior since window2 is modal however this behavior does not work till window2 manually receives focus via a mouse click.

1) How to get window2 as top-most window (window2,window1,page)?
2) Is there a way to control the display order of pop-up windows?

I have read the I cannot set hte z-index of the actual windows but only the window manager. I did try adding another window manager to the page. And then setting z-index of the 2 window managers. Window Mgr 1 for Window 1 and Window Mgr 2 for Window 2. Set z-index of Window Mgr 2 to higher value than Window Mgr 1. This did not solve the problem.

Let me know if you need more information.

Thanks for the help.
Mark.

[Svetlina Anati]

Hi crownmark,

I suggest to open the second window by using a little timeout as shown below:

function OpenWindow()
        {
         setTimeout(function(){GetRadWindow().BrowserWindow.OpenWindow('RadWindow2');},0);
        }

For your convenience I attached a sample demo project.


Regards,
Svetlina
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[MarkInTexas]

Svetlina,

Thanks for the quick response and example.

Ooops, I just noticed that I posted in the ASP.NET Ajax Windows forum and meant to post in the RadControls for ASP.NET Windows forum. Can u move this thread to that forum? Sorry bout that...

Both pop-ups are invoked via server side by setting DisplayOnLoad to TRUE. How can I change my server side code to delay window2? I am thinking the delay you have suggested might help and allow the page and window1 to load and then display window2. Just not sure how to do what you suggested server side.

Thanks,
Mark.

[MarkInTexas]

Svetlina,

Thanks for the quick response and example.

Ooops, I just noticed that I posted in the ASP.NET Ajax Windows forum and meant to post in the RadControls for ASP.NET Windows forum. Can u move this thread to that forum? Sorry bout that...

Both pop-ups are invoked via server side by setting DisplayOnLoad to TRUE. How can I change my server side code to delay window2? I am thinking the delay you have suggested might help and allow the page and window1 to load and then display window2. Just not sure how to do what you suggested server side.

Thanks,
Mark.

[MarkInTexas]

A little more information;
Please note that window1 is NOT modal, and window2 IS MODAL.

When window2 is shown it should be the Active window and not window1.

When I looked at the css I see that window1 has the active wrapper and window2 has the inactive wrapper.

Window1 has a lot more controls to load than window2, so I am thinking that window2 is displayed and then window1 gets the focus after it is done loading.

Using your suggestion for the timeout I added a timeout and wait 5 seconds and then set window2 as the active window. This works ok but not the best solution.

Review: Window2 is Modal, it should be the top-most active window and all other windows including window1 and the page should be disabled until window2 has been closed. Could this be a bug in the Window Control?

Thanks again,
Mark.

[MarkInTexas]

Svetlina,

Problem solved!

Based on the the example you posted and looking at other similar posts I have come up with the following solution:

The Modal Window now appears as Modal and as the top-most window.
Modal Window -> Other Window -> Page.

Cool!


Client Side Code:

  function ShowModalWindow()
  {
    // Per Telerik
    // Use a Timeout to show the window to work-around a IE Browser issue
    // Without this workaround the window will not be the top-most window
    window.setTimeout(
      function()
      {
        var oManager = GetRadWindowManager();    // get the window manager
        var arrWindows = oManager.GetWindows();  // get the array of windows
        var oModalWnd = arrWindows[2];           // There are 3 windows declared - this window is the 3rd in the list
        oModalWnd.Show();                        // Show the Modal Window
      },
      0);                                        // A timeout of 0 to work-around a browser issue? This does work!
  }

Server Side Code: I am using an Rad Ajax Panel - and use a response script to execute the above script from the code behind.

    protected void ShowModalWindow()
    {
      RadAjaxPanel1.ResponseScripts.Add("ShowModalWindow();"); // call the client side script
    }

Thanks for the help,
Mark.