OmniFaces 突出显示未使用 <p:ajax> 设置焦点

Question

我得到了一个简单的登录表单。我正在使用 <p:ajax> 来调用 <p:blockUI>（参见问题）。

<h:commandButton id="anmeldung_button"
action="#{benutzerAnmeldung.anmelden}" value="Anmelden"
styleClass="btn btn-info btn-sm">
    <p:ajax process="@form" update="@form"/>
</h:commandButton>
<p:blockUI id="block" block=":anmeldung" trigger="anmeldung_button" />

我正在使用 <o:highlight /> 来突出显示无效输入。这很好用。它也与 <f:ajax> 完美配合。

显然，它不适用于 <p:ajax>。

我怎样才能做到这一点？

Answer 1

这是由于 <p:ajax> 试图在通过 doEval() 执行 oncomplete 脚本后重新聚焦活动元素引起的（如在 handleReFocus() function in core.ajax.js script。但是，当您在输入中通过单击命令按钮而不是按 Enter 来提交表单时，该活动元素将成为命令按钮本身，而不是输入文本。您只需使用 Enter 键提交表单即可确认这一点。您会看到焦点设置正确。

在您的特定情况下，有 2 种方法可以解决此问题：

通过 <p:focus> 使用 PrimeFaces 自己的自动对焦功能，如下所示：

<h:form id="anmeldung"> <p:focus context="anmeldung" /> ... </h:form>

它还会自动考虑无效的输入字段。

在 JavaScript 中将 PrimeFaces.customFocus 设置为 true，这样 handleReFocus() 函数就不会工作了。

<script>PrimeFaces.customFocus = true;</script>

OmniFaces 突出显示未使用 <p:ajax> 设置焦点

OmniFaces highlight does not set focus with <p:ajax>

primefaces

jsf-2

omnifaces