jsf - 进度条的 Primefaces 动态标签

Question

嗨，我正在使用带有 Primefaces 的 JSF。我有一个很长的任务，在此期间我想向用户显示一个进度条，以进度(int)和状态(String)作为指示器。这两个参数映射到后端 bean 的两个字段。如果我使用 <p:poll> ，我可以同时更新两者，如以下代码所示:

<p:progressBar id="progress" ajax="false" value="#{backendBean.progress}" widgetVar="pbAjax"
  labelTemplate="{value}%: #{backendBean.statusMessage}" style="width:400px; font-size:12px"/>
<p:poll interval="1" id="poll" autoStart="false" update="progress" widgetVar="pbPoll"/>

一旦用户按下按钮， pbPoll.start() .这工作正常。现在我有两个问题:

(1) 最初是否可以隐藏进度条？我知道我可以将 display:none 放在 css 中，并在单击按钮时让它显示出来。但是投票更新会再次隐藏进度条。也许使用渲染。如果是这样，请告诉我如何。

(2) 由于 progressBar 本身具有 ajax 功能，我可以不使用 poll 吗？请注意，我在上面的代码中设置了 ajax=false。 On their website, it says "dynamic progress label" is added .我试过但不知何故标签只显示 "{value}%"没有状态消息。我想知道这是不是因为 #{statusMessage}需要另一个提取，因此被忽略，而两者都在轮询中检索。

谢谢!

Answer 1

是的你可以。这真的很容易。包裹您的<p:progressBar/>在像 <h:panelGrid/> 这样的面板中并设置 rendered进度条上的属性到支持 bean 中的 bool 值

 <h:panelGrid id="progressBarPanel">
                <p:progressBar id="progress" interval="100"  rendered="#{backendBean.progressBarRendered}" ajax="true" value="#{backendBean.progressMonitor}" widgetVar="pbAjax" labelTemplate="{value}%: #{backendBean.progressMonitor}" style="width:300px; font-size:12px"/>
 </h:panelGrid>

然后使用按钮(或其他东西)来切换 bool 值并更新 面板

  <p:commandButton value="Test Progress Bar" action="#{addressUpdate.progressBarControl}" oncomplete="pbAjax.start();" update="progressBarPanel"/>

您需要注意的一件事是切换进度条可见性的同一按钮不应使用 onclick事件而是 oncomplete启动进度条，原因是 onclick在请求到达服务器之前触发，并且在那个时候，进度条在 DOM 中不存在，所以 start()将是未定义的。

你是对的。如果您查看您的开发者控制台，您会看到以下关于进度条的 ajax 响应

 "thePanel:progress_value":20

这几乎总结了进度条在更新期间关心的内容，即进度条上的值绑定(bind)。如果这是您的必备品，请坚持使用您现在拥有的东西。