Primefaces ajax 更新不适用于 <p:column> 中的字段答案

【问题标题】：Primefaces ajax update not working for field inside <p:column>Primefaces ajax 更新不适用于 <p:column> 中的字段
【发布时间】：2018-04-19 21:33:50
【问题描述】：

我有一个这样的 primefaces 代码。选择下拉后，如果值为'M'，我想渲染一个评论文本区域。

它工作正常并显示 textarea，但在选择“F”时，即使 renderComments 值为 false，它也不会隐藏 textarea。

我认为由于标记，更新没有正常进行。请问如何解决这个问题

HTML

        <p:panelGrid>

            <p:row>
                <p:column style="width:15%">
                    <p:selectOneMenu id="gender" value="#{myBean.model.gender}">
                        <f:selectItem itemValue="M" itemLabel="Male" />
                        <f:selectItem itemValue="F" itemLabel="Female" />
                        <p:ajax event="change" listener="#{myBean.genderListener}" process="@this" update="commentsCol comments" />
                    </p:selectOneMenu>
                </p:column>

                <p:column id="commentsCol" style="width:50%">
                    <p:inputTextarea id="comments" cols="100" rows="2" value="#{myBean.model.comments}" rendered="#{myBean.renderComments}" />
                </p:column>
            </p:row>


        </p:panelGrid>

豆子

/**
 * Event for gender.
 */
public void genderListener() {

    if ("M".equalsIgnoreCase(model.getGender())) {
        renderComments = true;
    }
    else {
        renderComments = false;
    }
}

更新

如果我使用 update="@form" 它可以工作。然而，它更新了我没想到的整个表格。如果我只指定 id (cmetsCol cmets)，不确定是什么问题

【问题讨论】：

标签： java html primefaces

【解决方案1】：

我设法通过在元素周围包裹并单独使用 panelGroup id 来解决此问题。

等效的完整代码是这样的

    <p:panelGrid>
        <p:row>
            <p:column style="width:15%">
                <p:selectOneMenu id="gender" value="#{myBean.model.gender}">
                    <f:selectItem itemValue="M" itemLabel="Male" />
                    <f:selectItem itemValue="F" itemLabel="Female" />
                    <p:ajax event="change" listener="#{myBean.genderListener}" process="@this" update="commentsPanel" />
                </p:selectOneMenu>
            </p:column>

            <p:column style="width:50%">
                <h:panelGroup id="commentsPanel">               
                    <p:inputTextarea id="comments" cols="100" rows="2" value="#{myBean.model.comments}" rendered="#{myBean.renderComments}" />
                </h:panelGroup>
            </p:column>
        </p:row>

    </p:panelGrid>

【讨论】：

【解决方案2】：

我通过在 p:panelGrid 上添加一个 id 并更新它而不是列来解决了这个问题。

    <p:panelGrid id="foo">

        <p:row>
            <p:column style="width:15%">
                <p:selectOneMenu id="gender" value="#{myBean.model.gender}">
                    <f:selectItem itemValue="M" itemLabel="Male" />
                    <f:selectItem itemValue="F" itemLabel="Female" />
                    <p:ajax event="change" listener="#{myBean.genderListener}" process="@this" update="foo" />
                </p:selectOneMenu>
            </p:column>

            <p:column id="commentsCol" style="width:50%">
                <p:inputTextarea id="comments" cols="100" rows="2" value="#{myBean.model.comments}" rendered="#{myBean.renderComments}" />
            </p:column>
        </p:row>


    </p:panelGrid>

【讨论】：

谢谢，这只是我的伪代码中的一个错字。我现在更正了。在实际代码中，一切都很好。事实上，renderComments 标志正确地返回了 true & false，正如预期的下拉选择，但问题仍然存在于更新字段的某个地方。
感谢您的努力。这比 update="@form" 更好并且可以工作，但是，我在这个网格中有另一组字段并且也更新了这些字段。也许我必须为这些字段使用另一个 panelGrid。我不明白为什么个别领域不起作用。可能缺少更多语法。
@Jay 我不确定。当我试图只更新我认为奇怪的列时，我看到 ajax 更新正在从生成的 HTML 中删除 <td>。我认为将不同部分包装在面板网格中可能是您最好的选择。
抱歉，这不是完整的答案，这是一种解决方法。我用来解决这个问题。但我很欣赏这些努力。谢谢
好吧，根本问题是您需要更新的容器而不是但答案是由您自行选择的，所以我理解。

【解决方案3】：

尝试更新“cmets”而不是“cmetsCol”

【讨论】：

谢谢，但这不起作用。我已经尝试过这个和其他不同的组合。