在调用f:ajax侦听器之前和之后执行JavaScript

Execute JavaScript before and after the f:ajax listener is invoked

本文关键字：之后 执行 JavaScript 侦听器 调用 ajax      更新时间：2023-09-26

有一种简单的方法可以在调用<f:ajax listener>之前和之后调用JavaScript操作，例如，我想在之前调用window.alert("pre")，在onChange在后台调用ACtrl:之后调用window.alert("post")

<h:form>
    <h:inputText id="anId" value="#{cityCtrl.dbHost}">
        <f:ajax event="change" listener="#{aCtrl.onChange}" execute="@all"/>
    </h:inputText>
</h:form>

@ManagedBean
public class ACtrlimplements Serializable {
    public void onChange(AjaxBehaviorEvent event) {
        System.out.println("something changed");
    }
}

添加多个f:ajax元素似乎不起作用(也许应该？！(，例如在中

<h:form>
    <h:inputText id="anId" value="#{cityCtrl.dbHost}">
        <f:ajax event="change" listener="#{aCtrl.toggle}" execute="@all"/>
        <f:ajax event="change" listener="#{aCtrl.onChange}" execute="@all"/>
        <f:ajax event="change" listener="#{aCtrl.toggle}" execute="@all"/>
    </h:inputText>
</h:form>

@ManagedBean
public class ACtrlimplements Serializable {
    public void onChange(AjaxBehaviorEvent event) {
        System.out.println("something changed");
    }
    public void toggle(AjaxBehaviorEvent event) {
        System.out.println("blah");
    }
}

仅调用CCD_ 7。

使用onevent属性。它必须指向回调函数引用(所以不要包含括号！(：

<f:ajax ... onevent="functionName" />

实际的回调函数如下所示(JSF将自己提供参数(：

function functionName(data) {
    var status = data.status; // Can be "begin", "complete" or "success".
    var source = data.source; // The parent HTML DOM element.
    switch (status) {
        case "begin": // Before the ajax request is sent.
            // ...
            break;
        case "complete": // After the ajax response is arrived.
            // ...
            break;
        case "success": // After update of HTML DOM based on ajax response.
            // ...
            break;
    }
}

另请参阅：

  • JSF 2.0规范-表14.3和14.4
  • 有没有办法禁用命令链接，直到ajax响应被呈现出来
  • 如何在JSF 2中进行双击预防
相关文章：