How to prevent from user from clicking button twice(JSF command button not performing action if onclick property specified)

Question

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

this command button executing onclick event , but not calling action. it is JSF 1.2. I mean it is disabling the button but not executing the required action.

How to prevent user from submitting the form twice? if it is order two orders will be raised.

Could please help me.

try oncomplete instead of onclick – mstzn Oct 11 '12 at 14:36 — mstzn, Oct 11 '12 at 14:36
oncomplete is not available in JSF1.2 – Raju Boddupalli Oct 11 '12 at 14:46 — Raju Boddupalli, Oct 11 '12 at 14:46
@mstzn: you're confusing with PrimeFaces. – BalusC Oct 11 '12 at 15:59 — BalusC, Oct 11 '12 at 15:59
yes,I confused with Primefaces,Richfaces – mstzn Oct 11 '12 at 16:58 — mstzn, Oct 11 '12 at 16:58

Daniel · Answer 1 · 2012-10-11T19:11:36.733

0

I probably because you disable the button before your action is called. Try using setTimeout() like this

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

edited Oct 11 '12 at 19:11

answered Oct 11 '12 at 14:56

Daniel

36,833
10
119
200

score 0 · Answer 2 · answered Jun 27 '17 at 13:20

Just faced a similar situation with JSF 1.2.

We added a small javascript IIFE to disable the button but ONLY after the second click. That way the first submit will not be cancelled due to being disabled. The problem with the setTimeout() solution is it still allows for a double click before the button is disabled. You could probably do this in a more JSF way, by writing a function in javascript that is called by the JSF onclick. But we prefer to have all the code in one place.

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

This worked for us, the form post occured only once.

How to prevent from user from clicking button twice(JSF command button not performing action if onclick property specified)

2 Answers2

Linked