1

p:wizardp:dialog组件中有 PrimeFaces。我正在为下一步/上一步使用自定义按钮:

<p:commandButton value="Weiter" onclick="wiz.next()">

我想更改包含向导的对话框元素,在我的情况下是对话框标题:

<p:dialog id="dialogRespWizard"
        header="#{wizardBean.header}"

我已将代码更改为:

<p:commandButton value="Weiter" onclick="wiz.next()" update="dialogRespWizard">

但是在选择下一步后,整个对话框都消失了。

那么,如何在步骤更改时刷新“周围”向导?

4

2 回答 2

5

关于你的问题:

对话框消失是因为您更新了整个对话框(意味着整个对话框元素将从 HTML 页面中删除,并将被从服务器接收到的新对话框 HTML 元素替换),这是有意的。如果您想更新对话框中的某些内容,您需要在对话框中创建某种XXXpanel并更新该 XXXpanel(包装 HTML 对话框元素将是相同的,只是对话框的内容被替换为从服务器接收到的新内容):

<p:dialog id="dialogWizard" header="something">
  <p:outputPanel id="outputPanelWizard">
    // a lot of stuff which needs to get updated
  </p:outputPanel>
  <p:commandButton .... update="outputPanelWizard" />
</p:dialog>

...并且您的对话框不会再次隐藏。因此,您需要将标题放入您已经完成的方面,朝着正确的方向迈出一步。




对于您的自我回答问题

出现“闪烁”是因为您使用了onclickupdate。一旦用户单击p:commandButton ,就会执行Onclick。但是更新有时会在周期的后期发生(当浏览器收到来自服务器的响应时)。因此,向导使用wiz.next()进行切换,然后更新发生在对话框标题上。您可以只使用oncomplete而不是onclick ,并且在浏览器接收到来自服务器的响应以及对话框更新后将发生切换-> 不再“闪烁”。其他一些解决方案也存在,例如



不要在 p:commandButton 上使用 onclick/oncomplete/update,而是使用 RequestContext 处理动作/*actionListener*的所有内容,如此处所示RequestContext Showcase

this.header = "my new header";
context.execute("wiz.next();"); 
context.update("outputPanelWizard");  

优点是恕我直言,您可以评估表单(用户输入)并切换到wiz.next()是否适用。当用户输入不满意时,您可以留在同一页面上,只是不要调用wiz.next()。同样适用于标头,您可以根据用户输入更新支持 bean 中的内容。

于 2012-11-30T16:34:43.257 回答
2

因此,我通过将标头移动到facet来解决这个问题。在方面,我可以使用带有任意 id 的outputText,并在向导操作之后通过 id 更新这个组件。

<p:dialog id="dialogWizard">
<f:facet name="header">
  <h:outputText id="dialogHeader" value="#{wizard.header}" />
</f:facet>

<p:commandButton value="Weiter" onclick="wiz.next()" update="dialogHeader">

此解决方案的唯一问题是步骤更改后标题的可见“闪烁”。对话框内容首先更改,然后在标题更改片刻之后,用户可以看到这种不同意。

于 2012-11-30T07:45:21.780 回答