Question

在JSF页面中考虑以下表单：

<h:form id="countForm">
  <h:outputText value="#{myBean.count}" />
  <h:commandButton value="Increment the count!">
    <f:ajax listener="#{myBean.increment()}" render="@form" />
  </h:commandButton>
</h:form>

只要用户通过ajax请求点击按钮，这个简单的代码就会递增计数器。

假设我还希望向用户显示警报，以便在表单更新（重新呈现）时通知计数器的新值。我该怎么办？有没有类似下面的代码？

<h:form onUpdate="alert('the new value is #{myBean.count()}')">

我知道我可以使用primefaces的“oncomplete”方法，但事件会链接到按钮而不是表单，这不是我想要的。

计数器不是我想要做的，这只是一个更好地展示我的问题的简单例子。

提前感谢您的帮助。

Answer 1

很难提供确切的答案，因为您的确切要求并不明确 1.您是否尝试过具有<a4j:form>事件的onComplete？它没有解决你的问题吗？ 2.如果您在表单 reRendered 后完全需要运行脚本，则可以在表单中放置<script>标记，并将javascript代码放在其中，如下所示。

<h:form id="frm">
  <script>
    alert('#{myBean.count()}');
  </script>
</h:form>

每次呈现表单时都会显示此警报请注意，如果您需要在页面加载时阻止此JS运行，则可能需要添加如下条件。

<head>
  <script>
    var showAlert = false;
  </script>
</head> 
<body>
<h:form id="frm">
  <script>
    if(showAlert) {
      alert('#{myBean.count()}');
    }
    showAlert = true;
  </script>
</h:form>
</body>

Answer 2

您可以使用PrimeFaces中的ajax状态标记组件：<p:ajaxStatus>或RichFaces：<a4j:status>（链接到its documentation）。两个组件都处理从表单中进行的ajax调用开始和完成事件。

我没有在JSF 2应用程序中尝试过任何这些，但我建议使用PrimeFaces（至少文档比RichFaces更好）。我在JSF 1.2 + RichFaces 3.3应用程序中使用RichFaces <a4j:status>来显示/隐藏用户对任何ajax请求的对话框。它看起来像这样（并且可以给你一个想法）：

<a4j:status onstart="Richfaces.showModalPanel('mdpWaitMessage')" 
    onstop="Richfaces.hideModalPanel('mdpWaitMessage')" />
<!-- defining the modal (popup) panel to show the user there was an ajax action -->
<rich:modalPanel id="mdpWaitMessage" resizeable="false" zindex="5000"
    minHeight="30" minWidth="10" height="70" width="150">
    <f:facet name="header">
        <h:outputText value="#{aplicacion.waitMessageTitle}" />
    </f:facet>
    <h:graphicImage value="#{aplicacion.waitMessagePath}" />
    <h:outputText value="#{aplicacion.waitMessageDescription}" />
</rich:modalPanel>

Answer 3

查看javax.faces.event.PreRenderComponentEvent.

<h:form id="myForm">
  <f:event type="preRenderComponent"
           listener="#{someActionListener}" />
</h:form>

每次（重新）渲染表单时，都会首先调用actionListener。

Answer 4

有一种方法并不是很优雅，但我在没有其他选择的情况下使用它。我使用的<h:panelGroup>包含<script>块，我在render=部分的<f:ajax部分使用了panelGroup id

<h:form id="countForm">
  <h:outputText value="#{myBean.count}" />
  <h:commandButton value="Increment the count!">
    <f:ajax listener="#{myBean.increment()}" render="postAjax" />
  </h:commandButton>
  <h:panelGroup id="postAjax">
    <script>
     //...
    </script>
  </h:panelGroup>
</h:form>

请注意，如果panelGroup位于ui:repeat或datatable内，这将无效。

如何使用JSF在表单中检测渲染事件？

4 个答案: