使用 h:commandButton 进行 Ajax 更新和提交答案

【问题标题】：Ajax update and submission using h:commandButton使用 h:commandButton 进行 Ajax 更新和提交
【发布时间】：2013-03-21 13:17:44
【问题描述】：

如何更新一个div并使用<h:commandButton>进行部分提交，我之前使用<p:commandButton>通过将ajax属性设置为true并将update属性设置为:statusBlock进行部分提交，其中@987654323的id @ 是状态块。我在使用<p:commandButton> 时遇到了一些设计问题，所以我不能使用它，所以我必须使用<h:commandButton>。

【问题讨论】：

标签： ajax jsf jsf-2 primefaces

【解决方案1】：

这是通过在其中嵌套<f:ajax> 来完成的。

在效果上，

<p:commandButton ... process="@form" update=":statusBlock" />

完全一样

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

请注意，与 PrimeFaces 等效项的细微差别在于 PrimeFaces 在进程/执行中默认为@form，而<f:ajax> 默认为@this，因此您可能需要明确指定execute="@form"您没有在 PrimeFaces 组件中指定 process 属性的地方。

另见：

Communication in JSF 2.0 - Ajax (asynchronous) POST form

【讨论】：

h:commandButton中的execute和process属性有什么作用？
<f:ajax execute> 与<p:commandButton process> 完全相同。 <f:ajax render> 与 <p:commandButton update> 完全相同。这些属性只是指定在表单提交期间需要执行/处理哪些组件（在 PrimeFaces 的情况下默认为整个表单，在标准 JSF 的情况下为当前组件）。

【解决方案2】：

您可以在 f:ajax 旁边使用标准组件，例如

<h:form id="myForm">       
  <h:commandButton value="Push Me">
     <f:ajax execute="myForm" render="statusBlock" />
  </h:commandButton>
  <h:panelGroup id="statusBlock">
  </h:panelGroup> 
</h:form>

【讨论】：