p:commandButton 与 h:commandButton [英] p:commandButton vs. h:commandButton

问题描述

当我使用 PrimeFaces p:commandButton

When I am using a PrimeFaces p:commandButton

<p:commandButton action=#{bean.action} />

我没有看到输入的验证消息(默认的 h: 或 PrimeFaces p: 的.)例如与

I don't see the the validation messages for inputs (both the default h: ones or the PrimeFaces p: ones.) For example with

<f:validateRequired />

当我使用默认命令按钮时

When I am using default command button like

<h:commandButton action=#{bean.action} />

我确实看到了验证.造成这种差异的原因是什么?

I do see the validations. What can be the cause of this difference?

我使用的是 Prime Faces 3.5 和 Mojarra 2.1.18

I am using Prime Faces 3.5 with Mojarra 2.1.18

<h:form id="reliefhourheadcopy-form">

        <h:panelGrid columns="1">
            <h:outputText value="Kopiere Entlastungsstunden von" />
            <h:outputText value="Semester: #{reliefHourHeadManagedBean.reliefHourHead.semester}" />
            <h:outputText value="Jahr: #{reliefHourHeadManagedBean.reliefHourHead.year}" />
            <h:outputText value="nach" />               
        </h:panelGrid>

        <h:panelGrid columns="3">

            <h:outputText value="Semester:" />
            <p:selectOneMenu id="semester" value="#{reliefHourHeadManagedBean.semester}">
                <f:selectItems value="#{reliefHourHeadManagedBean.semesterTypes}" />
            </p:selectOneMenu>
            <h:message for="semester" />

            <h:outputText for="yearSpinner" value="Jahr:" />
            <p:spinner id="yearSpinner" value="#{reliefHourHeadManagedBean.year}" maxlength="4" min="2000" max="2030" size="4">
                <f:validateRequired />
                <f:validateLongRange minimum="2000" maximum="2030" />
            </p:spinner>
            <h:message for="yearSpinner" />

        </h:panelGrid>

        <h:panelGrid columns="1" style="margin-top:25px">
            <p:commandButton action="#{reliefHourHeadManagedBean.copyReliefHourHead}" value="Kopieren" icon="ui-icon-copy" >
                <f:param name="reliefhourhead_id" value="#{reliefHourHeadManagedBean.reliefHourHeadId}" />
            </p:commandButton>
        </h:panelGrid>

    </h:form>

推荐答案

就像@Partlov 在问题下方的评论中所写的那样，

Like @Partlov wrote in the comments below the question,

主要区别在于p:commandButton默认是AJAX，h:commandButton默认是非AJAX.

Main difference is that p:commandButton is AJAX by default, and h:commandButton is non-AJAX by default.

所以

<p:commandButton ... />

更像

<h:commandButton ...>
    <f:ajax/>
</h:commandButton>

但是

<p:commandButton ...>
    <p:ajax/>
</p:commandButton>

错误并导致未定义的行为

is wrong and leads to undefined behaviour

或者反过来

<h:commandButton ... />

就像

<p:commandButton ajax="false" ... />

p:commandButton 将默认提交表单.但是，默认情况下，在 ajax 调用完成后它不会更新表单中的任何内容，因此不会显示消息(在开发模式下，日志文件中会显示消息已入队但未显示).非 ajax h:commandButton 会刷新整个页面并显示消息.为了在使用 p:commandButton 时更新表单(包含消息组件)，您需要添加 update 属性:

The p:commandButton will submit the form by default. However by default it does not update anything in the form after the ajax call is finished so the messages are not displayed (which in development mode would have shown in the log files that messages were enqueued but not displayed) . The non-ajax h:commandButton does a full page refresh that does show the messages. In order to get the form (which contains the message component) updated when using the p:commandButton you need to add the update attribute:

<p:commandButton action="#{reliefHourHeadManagedBean.copyReliefHourHead}" value="Kopieren" icon="ui-icon-copy" update="@form">
    <f:param name="reliefhourhead_id" value="#{reliefHourHeadManagedBean.reliefHourHeadId}" />
</p:commandButton>

在 p:commandXXX 中添加(多余的)f:ajax 或 p:ajax 会导致奇怪的未定义行为

Adding an (superfluous) f:ajax or p:ajax inside a p:commandXXX can result in strange undefined behaviour

另见

• 了解 PrimeFaces 流程/更新和 JSF f:ajax 执行/渲染属性

这篇关于p:commandButton 与 h:commandButton的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！