全脸<o:validateMultiple>重置两个 PrimeFace<p:selectOneMenu> 验证失败后

Question

我有一个 OmniFaces <o:validateMultiple>设置为两个<p:selectOneMenu> 。 一个下拉框用于主场，另一个用于客队（体育比赛）。

验证器检查，如果两个团队的组合已经存在于日程表中，则验证器方法返回 false。 （见上表示例：组合已存在...列表中的单个项目）

现在的问题：

两个选择框被重置为它们的空值，但在后台，它们似乎保留了该值。

UI 告诉用户“选择已被清除”，但这不是我或用户所期望的。

例子

之前：验证：

验证后：

问题：

如何在验证失败后恢复选择框的值，或者我如何简单地保留这些值？

我猜重置输入只是 JSF 指定的行为？？ 🤷‍♂️

PrimeFaces 有问题吗（我猜不是）？

可以做到吗？ 如果是这样，如何？

PS：我认为发布选择框的 JSF 代码在这里没有帮助，但如果可以，请发表评论

Answer 1

JSF 应该保留由框架生命周期定义的组件树的状态。

但是，根据 JSF 页面的运行方式，您可以选择例如在事件发生时仅部分处理页面。 在这种情况下，只有处理过的组件会保留它们的状态。

让我们以您的用例为例，首先定义一个视图：

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core" xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui" xmlns:o="http://omnifaces.org/ui"
      xmlns:of="http://omnifaces.org/functions">
    <h:head>
        <title>SelectOneMenu Validation</title>
    </h:head>
    <h:body>
        <h:form>
            <o:validateMultiple id="validateMatch" components="home away"
                        validator="#{selectBackingBean.onValidateMatch}"
                        message="The combination already exists or is invalid!" />

            <p:dataList value="#{selectBackingBean.matches}" var="match">
                <f:facet name="header">Home / Away</f:facet>
                #{match.home} vs #{match.away}
            </p:dataList>
            <br/><br/>
            <p:selectOneMenu id="home" label="Please select home..." value="#{selectBackingBean.selectedHome}">
                <f:selectItems value="#{selectBackingBean.teams}" var="team" 
                           itemValue="#{team}" itemLabel="#{team}" />
            </p:selectOneMenu>
            <p:selectOneMenu id="away" label="Please select away..." value="#{selectBackingBean.selectedAway}">
                <f:selectItems value="#{selectBackingBean.teams}" var="team" 
                           itemValue="#{team}" itemLabel="#{team}" />
            </p:selectOneMenu>
            <h:panelGroup>
                <br/>
                <h:message for="validateMatch"  />
                <h:outputText value="OK!" rendered="#{facesContext.postback and not facesContext.validationFailed}" />
            </h:panelGroup>
            <br/><br/>
            <p:commandButton value="Save" action="#{selectBackingBean.onSave}" update="@form" />
        </h:form>
    </h:body>
</html>

让我们还定义保存视图状态和模型的支持 bean：

@Data
@Named
@ViewScoped
public class SelectBackingBean implements Serializable {
    private List<String> teams;
    private List<Match> matches;

    private String selectedHome;
    private String selectedAway;

    @Data
    @AllArgsConstructor
    public class Match {
        private String home;
        private String away;
    }

    @PostConstruct
    private void init() {
        teams = Arrays.asList("Malmö FF", "GAIS", "IFK Göteborg", "AIK");
        matches = new ArrayList<>(Arrays.asList(new Match("Malmö FF", "AIK")));
    }

    public boolean onValidateMatch(FacesContext context, List<UIInput> components,
                                List<String> values) {
        return values.get(0) != values.get(1) && !matches.contains(new Match(values.get(0), values.get(1)));
    }

    public void onSave() {
        matches.add(new Match(selectedHome, selectedAway)); 
    }
}

如果我们现在运行它，我们会得到以下结果：

如果我们继续前进并最终遇到验证错误，我们会得到以下信息：

请注意它如何不断地保留所有组件的状态。 OmniFaces 和 JSF 中的组件允许您控制组件树的选定部分的状态，以摆脱这种行为。

我猜您的代码中发生了一些事情，或者您正在以某种方式重置连接到组件的支持 bean 值。

全脸<o:validateMultiple>重置两个 PrimeFace<p:selectOneMenu> 验证失败后

问题描述

例子

1 个解决方案

解决方案1
2 2020-02-25 04:35:23

全脸<o:validateMultiple>重置两个 PrimeFace<p:selectOneMenu> 验证失败后

问题描述

例子

1 个解决方案

解决方案1 2 2020-02-25 04:35:23

解决方案1
2 2020-02-25 04:35:23