Question

This is the submit button:

<h:commandButton 
    actionListener="#{regBean.findReg}" 
    action="#{regBean.navigate}" value="Search" />

This is the form:

<h:form onsubmit="this.disabled=true;busyProcess();return true;">

If the submit button is pressed, the page shows a “busy” icon until request is processed. The problem is, the form is never submitted and the request never reaches the backend. However, if I instead take out the “disabled” call like so:

<h:form onsubmit="busyProcess();return true;">

Then everything works. Any ideas?

Answer 1

JSF relies on the presence of the name-value pair of the submit button to invoke a specific action in the server side. If you disable the form (at least, the button) before submitting the form, then no information will be available in the request parameter map and JSF will not invoke any action.

Your best bet is to introduce a timeout wherein you disable the button about 50ms after submitting. E.g.

onsubmit="setTimeout(function(){document.getElementById('formId:buttonId').disabled=true;},50);busyProcess();"

The explicit return true; at end is by the way superflous. Also, disabling the the HTML form element directly ain’t going to work since it doesn’t have a disabled attribute, you want to disable the button (and if necessary the other input elements as well).

Here’s some improvement:

<h:form onsubmit="busyProcess(this);">

with

function busyProcess(form) {
    setTimeout(function() {
        for (var i = 0; i < form.elements.length; i++) {
            form.elements[i].disabled = true;
        }
    }, 50);

    // Remnant of your code here.
}

---

Update: since I wondered that you told that it “works”, I tested the form’s disabled attribute in various browsers, it only works in MSIE (surprising..), but not in the other (real) browsers. You don’t want to be browserdependent, so forget it and go ahead with disabling the form’s individual elements.