twitter-bootstrap - 如何在 bootstrapvalidator 中一次显示一条消息

Question

我添加了三个验证消息。当我单击“提交”按钮时，所有三条消息都显示在 div 中。

有没有办法一次显示一条消息(优先级或哪个先出现。)

代码:

<div class="col-md-6">
    <input class="form-control" type="password" id="<isprint value="#NewPasswordForm:Password:QualifiedName#">" name="<isprint value="#NewPasswordForm:Password:QualifiedName#">" placeholder="Password" data-bv-notempty="true"
                required data-bv-notempty-message="<istext key="account.user.new.password.error.required"/>"
                data-bv-identical="true"
                data-bv-identical-field="<isprint value="#NewPasswordForm:ConfirmPassword:QualifiedName#">"
                data-bv-identical-message="<istext key="account.user.new.password.error.confirm_Password"/>"
                data-bv-regexp="true"
                data-bv-regexp-regexp="^(?=[^\s]*[a-zA-Z])(?=[^\s]*[\d])[^\s].{7,256}$"
                data-bv-regexp-message="<istext key="account.create_user.password.error.regexp"/>"
                />

以及按空格后的 HTML 代码。

<div class="col-md-6">
<input id="NewPassword_Password" class="form-control" type="password" data-bv-regexp-message="The password must be at least 7 characters in length." data-bv-regexp-regexp="^(?=[^\s]*[a-zA-Z])(?=[^\s]*[\d])[^\s].{7,256}$" data-bv-regexp="true" data-bv-identical-message="The password and its confirm are not the same." data-bv-identical-field="NewPassword_ConfirmPassword" data-bv-identical="true" data-bv-notempty-message="The password is required and cannot be empty." required="" data-bv-notempty="true" placeholder="Password" name="NewPassword_Password" data-bv-field="NewPassword_Password">
<i class="form-control-feedback glyphicon-remove glyphicon" style="" data-bv-icon-for="NewPassword_Password"></i>
<small class="help-block" style="" data-bv-validator="identical" data-bv-for="NewPassword_Password" data-bv-result="INVALID">The password and its confirm are not the same.</small>
<small class="help-block" style="" data-bv-validator="notEmpty" data-bv-for="NewPassword_Password" data-bv-result="INVALID">The password is required and cannot be empty.</small>
<small class="help-block" style="" data-bv-validator="regexp" data-bv-for="NewPassword_Password" data-bv-result="INVALID">The password must be at least 7 characters in length.</small>
</div>

请提供一些意见。

Answer 1

你可以用CSS隐藏它们:

small.help-block {
  display: none;
}

small.help-block:first-of-type {
  display: block
}