CODEWITHSUNDEEP
jsfdrop-down-menuprimefaces
Abs
Abs

Reputation: 3962

JSF select Primefaces selectOneMenu inside dialog hiding menu option z-index

View: 

<p:dialog header="Search in code tables" widgetVar="dlg" resizable="true">
    <p:selectOneMenu id="tableId" value="#{xxx.tableId}"
                        required="true" label="tableId">
                    <f:selectItems value="#{xxx.tables}" ></f:selectItems>
                    </p:selectOneMenu>

The z-index for the dialog causes the menu options to hide behind it.

I am following standard example from Primefaces showcase:

http://www.primefaces.org/showcase/ui/overlay/dialog/loginDemo.xhtml

This appears to be a know n issue http://forum.primefaces.org/viewtopic.php?f=3&t=33972

Can someone suggest a proper fix.

Upvotes: 1

Views: 5529

Answers (2)

Bender
Bender

Reputation: 647

Try to use panelStyle for selectOneMenu. Using appendTo = "@this" may cause something like this: hiding dropDown You could use panelStyle = "position:fixed" instead. Regards.

Upvotes: 1

Abs
Abs

Reputation: 3962

okay I have managed to figure this out.

I was missing a appendTo telling which component to append the select:

<p:selectOneMenu id="tableId" value="#{xxx.tableId}"
            required="true" label="tableId" appendTo="@this" >

This fixes the z-index as well as adding a scrollbar to the drop down.

I have not been able to find this anywhere so posting this self answer.

Upvotes: 4

Related Questions