SelectOneMenu not showing options after PrimeFaces upgrade

[steffenscheffler]

Hey :) I have updated PrimeFaces from Version 8 to 13 in a bigger project using the migration guides. Most things went pretty well - but all of the "p:selectOneMenu" do no longer work (>100 occurences). They show no value at all; and when clicking on them, nothing shows up in the dropdown list. As an example, here is one of the components:

<p:selectOneMenu id="filter_sent"
                                             value="#{filterBean.filterSent}">
    <f:selectItem itemLabel="#{msg['filter.all']}" itemValue="#{null}" noSelectionOption="true"/>
    <f:selectItem itemLabel="#{msg['filter.today']}" itemValue="1"/>
    <p:ajax event="change"
            listener="#{classAction.onValidateFilter}"
            update="activeFilter"/>
</p:selectOneMenu>

When I add var and p:column, then a value is shown:

<p:selectOneMenu id="filter_sent" var="filter"
                                             value="#{filterBean.filterSent}">
    <f:selectItem itemLabel="#{msg['filter.all']}" itemValue="#{null}" noSelectionOption="true"/>
    <f:selectItem itemLabel="#{msg['filter.today']}" itemValue="1"/>
    <p:column>#{filter}</p:column>
    <p:ajax event="change"
            listener="#{classAction.onValidateFilter}"
            update="activeFilter"/>
</p:selectOneMenu>

But unfortunately this does not show the actual label, but it will show the itemValue, e.g. "1" in the dropdown list. After selecting it, the correct label value is shown for the then selected value.
I think this might be related to CSS changes after the Upgrade, but unfortunately I am really inexperienced with CSS and have no idea where to start :-) Could anybody give me a heads up on what changed between the versions? (A lot of other css is "broken" aswell, but things remain usable - they just don't look good, but this will be taken care of later by the styling team. I just have to make sure that everything works functional-wise before handing over to them)
Thank you very much in advance!

[ks-pang-hao]

1. Make sure your #{filterBean.filterSent} is the String type. otherwise, you have to specifiy the data type with the attributre of [converter].
2. Remove all custom css from header then to try if the component works correctly to prevent the css errors.
3. Open the development mode from your chrome and obseve any error message from the console tab.

Maybe it helps.

[steffenscheffler]

Thank you very much for the input! The exact same code (first example) worked without any issues with primefaces 8 and also compared to the showcase it looks correct to me. Only after the upgrade to version 13, the menu stays empty (and does not show anything when clicking on it). As I mentioned, I feel like it is somehow related to CSS maybe, as a lot of our CSS broke after the upgrades. We are using an own theme, maybe this is part of the problem aswell. But as our themes and css is quite big and I am lacking knowledge in that area, I am not sure where to look ;-) I could do the workaround with p:column after every selectOneMenu, it does work, but it seems to be not intended that way.
Also, no errors on browser console.

[melloware]

ok then yeah it might be CSS related. Because I can't think of any other reason it would not work.

[steffenscheffler]

@melloware Thank you. I have removed custom css now, but the problem still persists. Maybe I have done something wrong with the upgrade - I have updated the PrimeFaces version in gradle to 13.0.10. Afterwards I fixed all compilation issues according to the migration guides.

In DOM it seems like there is a <div class="ui-helper-hidden-accessible"> that contains all the options that I would expect (selectItems). If I remove that css class, it shows a dropdown box with all values right above the actual primeFaces selectOneMenu

[melloware]

Yes that hidden needs to stay hidden that is what holds the form value for submit while the UI renders a different styled component.

@steffenscheffler start simple with a an executable example using the PrimeFaces Test project. It is the only way developers can debug your problem to help. Just put a simple SelectOne in that Test project with PF 13.0.10 and see if it works. If it does then you are back to there is something wrong with your code hiding the select one.

[tandraschko]

also maybe try 14.0.1 ;D

[kurtomerfaruk]

I was encountering similar problems, but I was using Jakarta Faces 4.0.4. So it was not about primefaces, it was about jakarta-faces-4.0.4. Could you have the same problem?

[melloware]

Closing this as inactive. Will re-open if reproducer is provided.