jsf - 如何使 commandButton 不完全刷新页面？如何使用 f :ajax?

Question

我有一个按钮来提交表单并调用托管 bean 操作。

<h:form>
    ...
    <h:commandButton value="Submit" action="#{bean.submit}" />
</h:form>

但是当我按下按钮时，它会刷新整个页面，有时还会更改 URL。

有没有办法不刷新页面并仍然调用操作？

Answer 1

使用 Ajax。这是嵌套的问题 <f:ajax> 在感兴趣的命令按钮内。

<h:form>
    ...
    <h:commandButton ...>
        <f:ajax execute="@form" render="@none" />
    </h:commandButton>
</h:form>

特别是 render="@none" (无论如何，这是默认值，您可以完全省略该属性)将指示 JSF 在提交后重新渲染任何内容。如果您打算仅重新渲染特定组件而不是整个页面，那么您还可以在 render 中指定该特定组件的 ID。属性。

<h:form>
    ...
    <h:commandButton ...>
        <f:ajax execute="@form" render="result" />
    </h:commandButton>
    ...
    <h:panelGroup id="result">...</h:panelGroup>
</h:form>

如果您已经在使用 PrimeFaces，那么只需使用 <p:commandButton> 即可。而不是 <h:commandButton> .它已经默认使用 ajax，所以你不需要嵌套在 <f:ajax> 中。 .您只需要记住使用属性名称 process和 update而不是 execute和 render .

<h:form>
    ...
    <p:commandButton ... update="result" />
    ...
    <h:panelGroup id="result">...</h:panelGroup>
</h:form>

execute属性默认为 @form已经，所以可以省略。
也可以看看:

Understanding PrimeFaces process/update and JSF f:ajax execute/render attributes

How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"

Why do I need to nest a component with rendered="#{some}" in another component when I want to ajax-update it?