Question

当我从selectOneMenu中选择另一个Skin时，我想更改inputTexts的值。一切都很顺利，我的转换器从菜单中返回正确的对象，但inputTexts没有更新。

<h:form>
    <h:selectOneMenu id="dropdownSkin"
        value="#{helloBean.currentSkin}" defaultLabel="Select a skin.."
        valueChangeListener="#{helloBean.skinValueChanged}" immediate="true"
        onchange="this.form.submit()" converter="SkinConverter" >
        <f:selectItems value="#{helloBean.mySkinsSI}" var="c"
            itemValue="#{c.value}" />
    </h:selectOneMenu>


    <br />
    <h:inputText id="name" value="#{helloBean.currentSkin.title}"></h:inputText>
    <br />
    <h:inputText id="tcolor" value="#{helloBean.currentSkin.titleBar.textColor}"></h:inputText>
    <br />
    <h:inputText id="bcolor" value="#{helloBean.currentSkin.titleBar.backgroundColorStart}"></h:inputText>
</h:form>

这是我的Bean的样子。我调试它并正确设置了Object currentSkin。现在我需要知道如何更新文本字段内容。

@ManagedBean
@SessionScoped
public class HelloBean implements Serializable {

private static final long serialVersionUID = 1L;

private List<ExtendedSkin> mySkins;
private List<SelectItem> mySkinsSI;
private ExtendedSkin currentSkin;

public void skinValueChanged(ValueChangeEvent e) {
    currentSkin = (ExtendedSkin) e.getNewValue();
    FacesContext.getCurrentInstance().renderResponse();
}

public List<ExtendedSkin> getMySkins() {
    mySkins = XMLParser.readExtendedSkins();
    return mySkins;
}

public List<SelectItem> getMySkinsSI() {
    mySkinsSI = new LinkedList<SelectItem>();
    for (ExtendedSkin s : getMySkins()) {
        mySkinsSI.add(new SelectItem(s, s.getTitle()));
    }
    return mySkinsSI;
}

public void setMySkinsSI(List<SelectItem> myItems) {
    this.mySkinsSI = myItems;
}

public ExtendedSkin getCurrentSkin() {
    if (currentSkin == null) {
        currentSkin = getMySkins().get(0);
    }
    return currentSkin;
}

public void setCurrentSkin(ExtendedSkin currentSkin) {
    this.currentSkin = currentSkin;
}
}

Answer 1

这里的问题是转换器正在填充helloBean.currentSkin对象的工作，但<h:inputText>中与helloBean.currentSkin：title有关的值， textColor和backgroundColorStart将发送到服务器并替换converter加载的实际值。换句话说：

执行转换器并根据所选值构建helloBean.currentSkin。
<h:inputText id="name">空值将发送到服务器，并将注入helloBean.currentSkin.title。其他2 <h:inputText> s。
将使用选定的helloBean.currentSkin加载视图，并将使用空值加载helloBean.currentSkin.title。其他2 <h:inputText> s。

这个问题有两种可能的解决方案：

将<h:inputText>移到表单外部，因此空值不会发送到服务器。加载视图时，它将保持转换器中加载的值。

<h:form>
    <h:selectOneMenu id="dropdownSkin"
        value="#{helloBean.currentSkin}" defaultLabel="Select a skin.."
        valueChangeListener="#{helloBean.skinValueChanged}" immediate="true"
        onchange="this.form.submit()" converter="SkinConverter" >
        <f:selectItems value="#{helloBean.mySkinsSI}" var="c"
            itemValue="#{c.value}" />
    </h:selectOneMenu>
</h:form>
<br />
<h:inputText id="name" value="#{helloBean.currentSkin.title}"></h:inputText>
<!-- rest of Facelets code... -->

由于您在下拉列表中更改所选值时加载helloBean.currentSkin，因此可以使用<h:selectOneMenu>中的<f:ajax>标记组件添加ajax行为并更新字段以更清洁的方式。我会选择这个解决方案。

<h:form>
    <!-- Note that there's no need of the onchange JavaScript function -->
    <h:selectOneMenu id="dropdownSkin"
        value="#{helloBean.currentSkin}" defaultLabel="Select a skin.."
        valueChangeListener="#{helloBean.skinValueChanged}" immediate="true"
        converter="SkinConverter" >
        <f:selectItems value="#{helloBean.mySkinsSI}" var="c"
            itemValue="#{c.value}" />
        <f:ajax process="@this" render="name tcolor bcolor" />
    </h:selectOneMenu>
    <br />
    <h:inputText id="name" value="#{helloBean.currentSkin.title}" />
    <h:inputText id="tcolor" value="#{helloBean.currentSkin.titleBar.textColor}" />
    <br />
    <h:inputText id="bcolor"
        value="#{helloBean.currentSkin.titleBar.backgroundColorStart}" />
</h:form>

您可以在this one等在线教程中了解有关<f:ajax>的更多信息。

由于您要在页面中使用ajax调用，因此应将托管bean范围从@SessionScoped更改为@ViewScoped。有关此内容的更多信息：Communication in JSF 2

选择selectOneMenu之后JSF更新inputText

1 个答案: