ap：tabView中的必填字段

Chris 发表于 Dev

克里斯

我有一个带tabView的jsf / primefaces页面，该页面无法正常运行。

如果我在选项卡1上进行了选择，然后移至选项卡2并保存，则效果很好。如果我停留在选项卡2上并再次保存，它将在第一个选项卡上显示必填字段的必填消息。

如果我返回第一个选项卡，则它应该被填充。如果我现在再次按保存，则在第一个选项卡上，它将再次起作用。

为什么jsf / primefaces认为此字段未填写？

页：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">
  <h:head />
  <h:body>

    <div style="height: 50px;">
      <p:messages id="messages" autoUpdate="true" showDetail="true" closable="true" />
    </div>

    <h:form id="form">

      <p:tabView id="tabs" dynamic="true">

        <p:tab id="tab1" title="Tab 1">
          <h:outputLabel value="Field 1" />
          <h:selectOneMenu required="true" requiredMessage="Must fill in field 1 selection">
              <f:selectItem itemLabel="Select..." itemValue="" noSelectionOption="true" />
              <f:selectItem itemLabel="1" itemValue="1" />
          </h:selectOneMenu>
          <br/>
        </p:tab>

        <p:tab id="tab2" title="Tab 2">
          <h:outputLabel value="Field 2" />
          <p:inputText required="false" />
          <br/>
        </p:tab>

      </p:tabView>

      <p:commandButton value="Save" ajax="true" action="#{tabBean.action}" update="form"
          oncomplete="setTimeout(function(){$('[id$=messages]').fadeOut()},'500')" />

    </h:form>
  </h:body>
</html>

豆角，扁豆：

@ViewScoped
@ManagedBean(name = "tabBean")
public class TabBean implements Serializable {

    private static final long serialVersionUID = 1L;

    public TabBean() { }

    @PostConstruct
    public void init(){ }

    public void action() {
        // do the save, if validation doesn't fail first
        addJsfMessage(FacesMessage.SEVERITY_INFO, "OK", "no prob");
    }

    private void addJsfMessage(Severity severity, String summary, String detail) {
        FacesMessage msg = new FacesMessage(severity, summary, detail);
        FacesContext.getCurrentInstance().addMessage(null, msg);
    }
}

在创建此示例时，我发现以下任何一项更改都消除了该错误，但都不是所希望的：

关闭动态加载（primefaces文档说in dynamic mode, only the active tab contents are rendered and when an inactive tab header is selected, content is loaded with ajax，我以为是在第一次加载时指的，但它似乎不仅隐藏已加载的选项卡，而且根本不呈现它们）
替换为<h:selectOneMenu ... />：<h:inputText required="true" requiredMessage="Must fill in field 1 text" />

BalusC

它是由联合导致<p:tabView dynamic="true">和<p:commandButton update="form">。

渲染（重新）时，动态选项卡视图仅包含当前活动的选项卡，而不包含其他选项卡。仅当更改选项卡时，它才会异步加载到HTML DOM树中。现在，您要提交更新整个表单的信息，包括动态选项卡视图，因此它将重新呈现，仅重新加载当前活动的选项卡。在您的特定情况下，HTML DOM树中根本不存在第一个选项卡，因此无法将任何内容发送到服务器端。

尝试在中更具体<p:commandButton update>。仅指定真正需要更新的组件，而不使用动态选项卡视图指定整个表单。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。