为复选框组延迟一个JSF AJAX侦听器

我有一个复选框组（h:selectManyCheckbox），带有一个AJAX事件，在复选框或未选中复选框时触发。这是直接与f:ajax，例如，f:ajax execute="@form" event="click"。为复选框组延迟一个JSF AJAX侦听器

我想加强这个不要在之后每点击重新执行。相反，我想要一个空闲的延迟，如果用户快速连续点击三个盒子，则只有一次而不是三次。

有没有办法让JSF AJAX侦听器（f:ajax）在这样的延迟之后触发？

来源

2012-10-01 wrschneider

为什么当你点击复选框时要调用ajax函数？如果您需要更新或渲染页面的某个部分，请使用普通JavaScript，不要将额外的调用添加到您的服务器。 –

@LuiggiMendoza：在重新呈现前重新应用业务规则服务器端。当然，如果我只是切换可视性，我会直接做jQuery。 – wrschneider

如果您还没有使用JSF 2.2，那么可以使用JS setTimeout()/clearTimeout()来超时onclick并在再次单击时清除以前设置的任何值。

E.g.

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

与基本（也使用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，设置<f:ajax>的delay属性。

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

来源

2012-10-01 18:43:33 BalusC

聪明地使用闭包，我喜欢它。 – wrschneider

不客气。 – BalusC

非常感谢。此代码也适用于onblur事件！ – Ralph

为复选框组延迟一个JSF AJAX侦听器

回答

相关问题