2 Replies Latest reply on May 30, 2012 12:06 PM by bcn

popup size dependent on browser window size?

bcn May 11, 2012 5:52 PM

I have a big rich:popupPanel. On small browser windows or small devices, with option autosize=true it is bigger than the browser window,

which is ugly.

How can I make it smaller on small browser windows, to fit within the window, but maintain the ideal size if there is enough space?

Something like <rich:popupPanel width="#{browserwindow.width > 400 ? 380 : browserwindow.width-20}">

Is there such a variable?

Note that it is enough to use the browser window size in the moment of the pop up action. It is not necessary to resize the popup automatically when

the user resizes manually the browser window.

Thanks

1. Re: popup size dependent on browser window size?

jhuska May 15, 2012 9:41 AM (in response to bcn)

Hi,

I think that you can achieve your desired functionality by following this demo:
http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=hashParam&skin=blueSky

To pass the size of the popup component via hash param to the popup's show method.

Is it helpful ?
1 of 1 people found this helpful
Actions
2. Re: popup size dependent on browser window size?

bcn May 30, 2012 12:06 PM (in response to jhuska)

Thanks, it was helpful. I use a slightly different version, because I don't use rich:componentControl, but an oncomplete="show".
So I send the width and height as request parameters to the server and use them to control the popup width/height.

<a4j:commandLink render="editPane" oncomplete="#{rich:component('editPane')}.show()">
<a4j:param noEscape="true" name="width" value="jQuery(window).width()-20" />
<a4j:param noEscape="true" name="height" value="jQuery(window).height()-20" />

<rich:popupPanel id="editPane" resizeable="true" width="#{param.width > 700 ? 700 : param.width}" height="#{param.height > 500 ? 500 : param.height}" modal="true" >
Actions