h:inputText 在更改 h:selectOneMenu 值时未重新呈现，未按预期工作

Question

我有一个 h:selectOneMenu，当它的值更改为特定值（比如“2”）时，它应该显示隐藏字段（尚未呈现）。请注意，它们链接到托管 bean 中属性的相同值。

<h:outputText value="Function:"></h:outputText>
<h:selectOneMenu id="funDrp" converter="FunctionConv" value="#{cardBean.card.functionId}">
    <f:selectItems value="#{commonData.functions}" var="c" itemLabel="#{c.description}" itemValue="#{c.functionId}" />
    <f:ajax render="@form" execute="@form" event="valueChange" />
</h:selectOneMenu>

<h:outputText value=" Profile Id:" rendered="#{(cardBean.card.functionId.functionId==2)}"></h:outputText>
<h:inputText id="card_refillProfileId"rendered="#{(cardBean.card.functionId.functionId==2)}" label="Refill Profile Id" required="true" value="#{cardBean.card.refillProfileId}"></h:inputText>

<h:outputText value="Origin Type:" rendered="#{(cardBean.card.functionId.functionId==2)}"></h:outputText>
<h:inputText id="card_originType" rendered="#{(cardBean.card.functionId.functionId==2)}" label="Origin Node Type" required="true" value="#{cardBean.card.originType}"></h:inputText>

如果将“卡片”对象分配给现有实体，它们可以正常工作，但如果它是新实体 - 它不会按预期工作。

Answer 1

这是一个完全预期的行为。使用<f:ajax>，您可以重新呈现存在于您的DOM 中的HTML 元素，但是通过在您的JSF 组件中指定rendered="false"，它们不会出现在您的DOM 中。而且，由于 ajax 需要通过元素的 idfind 元素，然后替换它，这个工作显然无法完成。

然而，你的工作可以通过在容器中包含你的组件（所有这些都使用rendered 属性）来处理，例如在<h:panelGroup id="to-be-rerendered"> 中，它总是被渲染，但它的子组件 - 不是。因此，如果满足条件，ajax 将能够重新渲染面板，该面板将包含您所有带有rendered="true" 的组件，并且它们将出现在您的视图中。

附带说明，如果您的视图/表单增长，您的 ajax 行为可能会非常昂贵。因此，如果您只想重新渲染 一些 组件，请在 <f:ajax> 标记中指定它：<f:ajax render="to-be-rerendered" />（要渲染的组件的空格分隔 ID 列表）。

Answer 2

问题是附加到选择一个菜单的值是空的“card.functionId”。所以在检查它之前初始化它。因为我试图在构造bean之前初始化它，但它没有帮助。

为此，初始化是通过为 selectOneMenu 附加一个“ValueChangeListener”来完成的

<h:selectOneMenu id="funDrp" converter="FunctionConv" valueChangeListener="#     {cardBean.changeCardFunc}"
                                            value="#{cardBean.card.functionId}">
                                            <f:selectItems value="#{commonData.functions}" var="c"
                                            itemLabel="#{c.description}" itemValue="#{c.functionId}" />
                                            <f:ajax render="@form" execute="funDrp" event="change" />
                                          </h:selectOneMenu>

在托管 Bean 中：

public void changeCardFunc(ValueChangeEvent e) {
//  object newFunc= e.

    if(card!=null){
    card.setFunctionId((Function)e.getNewValue());
    }else {
        card= new Card();
        card.setFunctionId((Function)e.getNewValue());
        System.err.println(e.getNewValue());
    }
}

Answer 3

试试

<f:ajax render="card_refillProfileId card_originType" execute="@form" event="valueChange" />

Answer 4

你的

<f:ajax render="@form" execute="@form" event="valueChange" />

应该是（事件可以省略）

<f:ajax render="@form" execute="@form" event="change" />

selectOneMenu.value、您的转换器和渲染的 EL 之间似乎存在不匹配。 有两次functionId.functionId。并且selectOneMenu.value 绑定到cardBean.card.functionId。如果functionId 是一个函数，我可能错了。