如何防止用户单击按钮两次(如果指定了onclick属性,则JSF命令按钮不执行操作)

时间:2012-10-11 14:29:33

标签: jsf button

  <h:commandButton styleClass="button"  id="button_check" onclick="this.disabled=true;this.value='Please wait...';" action="#{pc_AMyBean.doCheckAction}" value="CHECK NOW"/> 

此命令按钮执行onclick事件,但不执行调用操作。它是JSF 1.2。 我的意思是它禁用了按钮但没有执行所需的操作。

如何防止用户两次提交表单?如果是订单,将会提出两个订单。

请帮助我。

2 个答案:

答案 0 :(得分:0)

我可能是因为你在调用动作之前禁用了按钮。尝试使用setTimeout()这样的

<h:commandButton styleClass="button"  id="button_check" 
   onclick="setTimeout('document.getElementById(\'' + this.id + '\').disabled=true;', 50);" 
   action="#{pc_AMyBean.doCheckAction}" value="CHECK NOW"/> 

答案 1 :(得分:0)

刚刚遇到与JSF 1.2相似的情况。

我们添加了一个小的javascript IIFE来禁用按钮,但仅在第二次点击后。这样,由于被禁用,第一次提交不会被取消。 setTimeout()解决方案的问题是它仍然允许在禁用按钮之前双击。您可以通过在JSF onclick调用的javascript中编写函数,以更JSF的方式执行此操作。但我们更愿意将所有代码放在一个地方。

(function($) {
    var clickCounter = 0;
    $('#button_check').on('click', function() {
        if (clickCounter > 0) {
           $(this).attr('disabled', true);
        }
        clickCounter += 1;
    }
})(jQuery);

这对我们有用,表格帖子只发生过一次。