jsf - 封闭 panelGrid 到 selectonemenu 的效果

Question

我遇到了 primefaces selectOneMenu 的问题，并且（意外地）修复了它。但我不知道为什么，因为我所做的只是将 panelGrid 包裹在我的所有组件周围。（我没有触及转换器或底层bean）

以下是重现行为的示例：

豆：

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;

import javax.annotation.PostConstruct;
import javax.inject.Named;

import org.apache.myfaces.extensions.cdi.core.api.scope.conversation.ViewAccessScoped;

@Named("testBean")
@ViewAccessScoped
public class TestBean implements Serializable {

    private static final long serialVersionUID = -8394494304848902124L;

    private String selectedString;

    private List<String> things;
    private List<String> listAvailableStrings;

    @PostConstruct
    public void init() {
        things = new ArrayList<String>();
        things.add("Car");
        things.add("Cat");
        things.add("House");
        things.add("Bank");

        listAvailableStrings = new ArrayList<String>();
        listAvailableStrings.add("one");
        listAvailableStrings.add("two");
        listAvailableStrings.add("three");
        listAvailableStrings.add("four");

    }

    public void printThings() {
        System.out.println(this.things.get(0));
    }

    public void onStringChange() {
        System.out.println(this.selectedString);
    }

    public String getSelectedString() {
        return selectedString;
    }

    public void setSelectedString(String selectedString) {
        this.selectedString = selectedString;
    }

    public List<String> getListAvailableStrings() {
        return listAvailableStrings;
    }

    public void setListAvailableStrings(List<String> listAvailableStrings) {
        this.listAvailableStrings = listAvailableStrings;
    }

    public List<String> getThings() {
        return things;
    }

    public void setThings(List<String> things) {
        this.things = things;
    }

}

我的 xhtml 版本，其中 selectOneMenu不起作用（selectedString 始终为空）：

    <h:form id="testForm">
        <p:panelGrid id="testPanel">

            <p:dataTable id="testTable" value="#{testBean.things}" var="thing">
                <p:column headerText="Things">
                    <h:outputText value="#{thing}" />
                </p:column>

            </p:dataTable>

            <p:commandButton id="btnPrintThing" value="DoIT"
                actionListener="#{testBean.printThings()}">
            </p:commandButton>


    </p:panelGrid>
            <p:spacer height="20" width="100%" />

            <p:panelGrid id="panel2" columns="3" border="0" cellpadding="0"
                style="width:80%">

                <p:panelGrid id="panel2_1">

                    <p:row>
                        <p:column>
                            <p:outputLabel for="somTestSOM" value="selectOneNotWorking"></p:outputLabel>
                        </p:column>
                        <p:column>
                            <h:messages></h:messages>
                            <p:selectOneMenu id="somTestSOM" onchange=""
                                value="#{testBean.selectedString}">
                                <p:ajax update="@([id$=panel2_3])"
                                    listener="#{testBean.onStringChange}" />
                                <f:selectItem itemValue="#{null}" itemLabel="" />
                                <f:selectItems value="#{testBean.listAvailableStrings}"
                                    var="thingSOM" itemValue="#{thingSOM}" itemLabel="#{thingSOM}"></f:selectItems>
                            </p:selectOneMenu>
                        </p:column>

                    </p:row>

                </p:panelGrid>

                <p:spacer width="1" height="250"
                    style="position: relative; bottom: -5px; top: -10px; background-color: #A8A8A8; margin-left: 20px; margin-right: 20px" />


                <p:panelGrid id="panel2_3">
                    <p:row>
                        <p:column colspan="2">
                            <p:outputLabel value="#{testBean.selectedString}"></p:outputLabel>
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panelGrid>

    </h:form>

我的 xhtml按预期工作的版本：（selectedString 代表 selectOneMenu 的选择）

<h:form id="testForm">
        <p:panelGrid id="testPanel">

            <p:dataTable id="testTable" value="#{testBean.things}" var="thing">
                <p:column headerText="Things">
                    <h:outputText value="#{thing}" />
                </p:column>

            </p:dataTable>

            <p:commandButton id="btnPrintThing" value="DoIT"
                actionListener="#{testBean.printThings()}">
            </p:commandButton>



            <p:spacer height="20" width="100%" />

            <p:panelGrid id="panel2" columns="3" border="0" cellpadding="0"
                style="width:80%">

                <p:panelGrid id="panel2_1">

                    <p:row>
                        <p:column>
                            <p:outputLabel for="somTestSOM" value="selectOneNotWorking"></p:outputLabel>
                        </p:column>
                        <p:column>
                            <h:messages></h:messages>
                            <p:selectOneMenu id="somTestSOM" onchange=""
                                value="#{testBean.selectedString}">
                                <p:ajax update="@([id$=panel2_3])"
                                    listener="#{testBean.onStringChange}" />
                                <f:selectItem itemValue="#{null}" itemLabel="" />
                                <f:selectItems value="#{testBean.listAvailableStrings}"
                                    var="thingSOM" itemValue="#{thingSOM}" itemLabel="#{thingSOM}"></f:selectItems>
                            </p:selectOneMenu>
                        </p:column>

                    </p:row>

                </p:panelGrid>

                <p:spacer width="1" height="250"
                    style="position: relative; bottom: -5px; top: -10px; background-color: #A8A8A8; margin-left: 20px; margin-right: 20px" />


                <p:panelGrid id="panel2_3">
                    <p:row>
                        <p:column colspan="2">
                            <p:outputLabel value="#{testBean.selectedString}"></p:outputLabel>
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panelGrid>
        </p:panelGrid>
    </h:form>

使用版本：

• 莫哈拉 2.2.13
• Primefaces 6.0
• 帕亚拉 4.1.1 #163
• CODI 1.0.6
• 焊接 2.3.5
• JSF 2.1

谁能解释一下为什么第一个版本是错误的，所以我可以考虑到进一步的发展。

谢谢