延迟的JSF AJAX侦听器复选框组 [英] Delay a JSF AJAX listener for checkbox group

问题描述

我有一个复选框组（ H：selectManyCheckbox ）与AJAX事件，火灾，当复选框被选中或取消选中。这是简单的用 F：AJAX ，例如 F：AJAX的执行=@表事件=点击 。

I have a checkbox group (h:selectManyCheckbox) with an AJAX event to fire when boxes are checked or unchecked. This is straightforward with f:ajax, e.g., f:ajax execute="@form" event="click".

我想加强这不是之后重新执行的每次的点击。相反，我想空闲的延迟，例如，如果用户点击了三盒临门，这里只有一个往返，而不是三个。

I'd like to enhance this to not re-execute after every click. Instead, I'd like an idle delay such that if the user clicks three boxes in quick succession, there's only one round trip instead of three.

有没有办法让一个JSF AJAX监听器（ F：AJAX ）？这样的延迟后起火

Is there a way to have a JSF AJAX listener (f:ajax) fire after a delay like this?

推荐答案

如果你不是对JSF 2.2还没有，你可以使用JS 的setTimeout（） / clearTimeout（）超时的onclick，再次点击时清除任何previously设置的。

If you're not on JSF 2.2 yet, you could use JS setTimeout()/clearTimeout() to timeout the onclick and clear any previously set ones when clicked again.

例如。

<h:selectManyCheckbox ... styleClass="delayClick">
    <f:selectItems ... />
    <f:ajax ... />
</h:selectManyCheckbox>

使用基本（也使用jQuery的一点帮助）

with basically (also with a little help of jQuery)

$(".delayClick input").each(function(index, input) {
    var onclick = input.onclick;
    input.onclick = null;

    $(input).on("click", function(event) {
        delay(function() { onclick.call(input, event); }, 1000);
    });
});

var delay = (function() {
    var timer = 0;

    return function(callback, timeout) {
        clearTimeout(timer);
        timer = setTimeout(callback, timeout);
    };
})();

如果您已经在JSF 2.2，将延迟＆LT 属性; F：AJAX＆GT; 。

If you're already on JSF 2.2, set the delay attribute of <f:ajax>.

<h:selectManyCheckbox ...>
    <f:selectItems ... />
    <f:ajax ... delay="1000" />
</h:selectManyCheckbox>

这篇关于延迟的JSF AJAX侦听器复选框组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！