在f：ajax监听器被调用之前和之后执行JavaScript [英] Execute JavaScript before and after the f:ajax listener is invoked

问题描述

有一种简单的方法可以在调用< f：ajax listener> 之前和之后调用JavaScript操作，例如我想在和 window.alert（post）之前调用 window.alert（pre） 在支持bean ACtrl 中调用onChange ：

It there an easy way to invoke a JavaScript action before and after the invocation of an <f:ajax listener>, e.g. I'd like to invoke window.alert("pre") before and window.alert("post") after onChange is invoked in the backing bean ACtrl:

<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 元素似乎不起作用（也许它应该？！），例如in

Adding multiple f:ajax elements doesn't seem to work (maybe it should?!), e.g. in

<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");
    }
}

仅 ACtrl.onChange 被调用。

推荐答案

使用 onevent 属性。它必须指向一个回调函数引用（所以不包括括号！）：

Use onevent attribute. It must point to a callback function reference (so don't include parentheses!):

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

因此实际的回调函数看起来像这样（JSF将自己提供参数）：

Whereby the actual callback function look like this (JSF will provide the argument all by itself):

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



See also:

• JSF 2.0 specification - tables 14.3 and 14.4
• Is there a way to disable the command link until the ajax response is rendered
• How to do double-click prevention in JSF 2

这篇关于在f：ajax监听器被调用之前和之后执行JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！