p:selectOneMenu preselects previous item when noSelectionOption item is present

Question

There is a problem with p:selectOneMenu selection when adding a f:selectItem.

View:

<p:selectOneMenu value="#{selectionTest.selectedName}">
    <f:selectItem itemLabel="Select" noSelectionOption="true" />
    <f:selectItems value="#{selectionTest.allNames}" var="varName" itemLabel="#{varName}" itemValue="#{varName}" />
</p:selectOneMenu>

Model:

private List<String> allNames;
private String selectedName;

public MenuSelectionTestBean(){
    allNames = new ArrayList<String>();
    allNames.add("Ahmed");
    allNames.add("Mohamed");
    allNames.add("Ibrahim");
    allNames.add("Walid");

    selectedName ="Walid";
}

Result:

The item "Walid" should be selected, however "Ibrahim" is selected instead. I think that PrimeFaces selects the item depending on its index in the list and not the value of the item.

How is this caused and how can I solve it?

Answer 1

I could reproduce your problem. I looked in the PrimeFaces source code. It's a bug in PrimeFaces SelectOneMenuRenderer which exposes only when an item with noSelectionOption="true" is been used. The renderer won't generate the HTML <option> element of the backing <select> element for that, but it will generate the <li> of the visual <ul> list for that. In other words, the <select> contains in your case 4 items and the <ul> 5 items. The <li> is selected by JavaScript based on the index of the <option selected>, exactly as you suspected. That explains your problem.

Your best bet is to report it as a bug to PrimeFaces guys. The renderer should also generate the <option> for that, or the JavaScript should select the option based on value instead of on index.

In the meanwhile, replacing the noSelectionOption="true" by itemValue="#{null}", or also itemValue="" when JSF is configured to interpret empty string submitted values as null, should solve your problem.