How to use rich:modalPanel on top of other windows in application

Question

I Have richmodal panel, but on browse button click I open that rich modal panel, which is not yet top on other window. some of screen portion overlapping so I could not use as modal window.

I tried many options but no luck. Here is my code

<rich:modalPanel id="orderSearchAndSelectModalPanel" resizeable="false" 
        top="130" width="750" height="650" moveable="true" label="#{prop2.exportLabel}" domElementAttachment="form">

Answer 1

rich:modalPanel is represented as div in HTML. It means modal panel is not separate window (is part of the same window as UI component which initiate show of modal panel). Based on this information you cannot expect that modal panel will be on top of other window.

Answer 2

I believe you mean how to make your rich:modalPanel overlap other opened modalPanel. So this is easy to do. rich:modalPanel has zindex attribute which defines z-axis coordinate in html markup. You need to define different values for such attribute to different modelPanels to define who overlaps who.

for example your modelPanel will look like this:

<rich:modalPanel id="orderSearchAndSelectModalPanel" zindex="1000" resizeable="false" 
    top="130" width="750" height="650" moveable="true" label="#{prop2.exportLabel}" domElementAttachment="form" >