Primeface 的 ajax 事件模糊阻止表单提交

Question

我有一个 JSF 页面，其中包含一些 Primefaces 组件，包括输入文本和提交按钮。在 <p:inputText> 中有 <p:ajax event="blur" update="@this" />.

当我将插入符（文本光标）留在输入文本之外时，提交工作正常，否则，如果我将插入符留在输入文本内，则不会提交，但再次单击该按钮表单提交正常。

使用 Chrome 调试 ajax 调用我可以看到正在发送的内容：

我认为那只是模糊事件，并没有发生提交。有什么帮助吗？谢谢

Answer 1

我试图用 PrimeFaces 10 和 Chrome 89 重现这个，但没能成功。因此，升级您的 PrimeFaces 版本（如果您还没有使用 10）可能会有所帮助。如果这对您没有帮助，可能值得在 PrimeFaces GitHub repo 报告该问题。如果这样做，请创建一个复制器并包含版本号。

您可以尝试通过以下方式解决此问题：

使用 async="true"，这样您的 Ajax 请求就不会排队。您可以在 p:ajax 和 p:commandButton.
为您的 p:ajax 设置一个轻微的延迟，例如 delay="50"（值以毫秒为单位）。

就其价值而言，这对我有用：

<h:form id="frmTest">
    <h:panelGroup id="header">
        <h1>#{testView.string}</h1>
    </h:panelGroup>

    <p:inputText value="#{testView.string}"
                 maxlength="#{testView.string.length()}">
        <p:ajax event="blur"
                update="@this" />
    </p:inputText>

    <p:commandButton value="Submit"
                     update="header"/>
</h:form>

更改输入，将焦点留在输入中并单击提交按钮会导致两个请求。第一个更新输入，第二个更新 header.

Primeface 的 ajax 事件模糊阻止表单提交

Primeface's ajax event blur prevents form submit

javascript

jsf

primefaces