Forms JSF<；f：验证器>；和引导不一起工作

我正在尝试让我的JSF注册表单使用引导样式。一切正常，但我不知道如何将验证消息集成到表单中。如果我呈现这段代码，验证消息就会被忽略。我不知道为什么？你知道我怎样才能让它们看起来更显眼，或者让它们看起来更漂亮吗？非常感谢您的帮助

        <!-- Register Form -->
        <h:form role="form" style="width: 400px; margin: 0 auto;">
            <!--  User name -->
            <div class="required-field-block">
                <h:outputLabel for="name" value="Benutzername"></h:outputLabel>
                <h:inputText id="name" value="#{userBean.user.name}"
                    validatorMessage="gültigen Benutzernamen mit 4-116 Zeichen" class="form-control">
                    <f:validateLength minimum="4" maximum="16" for="name"></f:validateLength>
                </h:inputText>
                <div class="required-icon">
                    <div class="text">*</div>
                </div>
            </div>
            <!-- Password -->
            <div class="required-field-block">
                <h:outputLabel for="password" value="Passwort"></h:outputLabel>
                <h:inputSecret id="password" value="#{userBean.user.password}"
                    class="form-control" required="true"
                    requiredMessage="Mailadresse angeben">
                </h:inputSecret>

                <div class="required-icon">
                    <div class="text">*</div>
                </div>
            </div>
            <!--  Email -->
            <div class="required-field-block">
                <h:outputLabel for="email" value="Email"></h:outputLabel>
                <h:inputText id="email" value="#{userBean.user.email}"
                    class="form-control" required="true"
                    requiredMessage="Passwort angeben">
                    <!-- Email Validation -->
                    <f:validator validatorId="emailValidator"></f:validator>
                </h:inputText>

                <div class="required-icon">
                    <div class="text">*</div>
                </div>
            </div>
            <!-- Age -->
            <div>
                <h:outputLabel for="age" value="Alter"></h:outputLabel>
                <h:inputText id="age" value="#{userBean.user.age}" class="form-control"></h:inputText>
                <h:message for="age"></h:message>
            </div>
            <h:commandButton id="send" value="Register" type="submit"
                action="#{userBean.addUser}" class="btn btn-primary"></h:commandButton>
            <h:message for="send"></h:message>
            <h:commandButton id="reset" value="Reset" type="submit"
                action="#{userBean.reset}" immediate="true" class="btn"></h:commandButton>
            <h:message for="send" errorClass="errorMessage" globalAll="true"></h:message>
        </h:form>

*
*
*

只需在每个所需输入下使用jsf标记

，属性为

，您应该将
输入的id指向那里。

此外，为了美观，您还可以添加引导类
“text text-text-danger”
。您还可以将属性
标签
用于

这意味着您将得到以下错误：

Email:Validation Error

而不是

email-id: Validation error.

例如：

    <h:outputLabel for="email" value="Email"></h:outputLabel>
                    <h:inputText id="email-id" label="Email" value="#{userBean.user.email}"
                        class="form-control" required="true"
                        requiredMessage="Passwort angeben">
                        <!-- Email Validation -->
                        <f:validator validatorId="emailValidator"></f:validator>
                    </h:inputText>
 <h:message for="email-id"/>