4

I want to be able to disable the commandbutton below once it's hit and enable it once the event listener runs and msg1 is rendered.

<h:commandButton value="Submit">                    
  <f:ajax execute="@form" render="msg1" listener="{bean.method}" />
</h:commandButton>

How could I do this?

UPDATE: I found out that I can attach onclick event to the commandButton element itself to disable it. How can I detect the listener method has returned so I can enable the button again?

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Mark13426
  • 2,569
  • 6
  • 41
  • 75
  • Please note that you aren't using JSP, but JSF. Even more, you're most likely using JSP's successor Facelets (the `f:ajax` isn't directly supported in JSP). I edited the title and tag. Keep this in mind for future questions. To learn about the differences, see http://stackoverflow.com/questions/2095397/what-is-the-difference-between-jsf-servlet-and-jsp/2097732#2097732 – BalusC Nov 03 '11 at 20:09

2 Answers2

5

You could do it with help of the onevent attribute of <f:ajax> which points to a JavaScript function which handles the JSF Ajax events.

E.g.:

<h:commandButton value="Submit">
  <f:ajax execute="@form" render="msg1" listener="#{bean.method}" onevent="handleDisableButton" />
</h:commandButton>

(note that I fixed the wrong EL in listener as well)

with this JS:

function handleDisableButton(data) {
    var buttonElement = data.source; // The HTML DOM element which invoked the ajax event.
    var ajaxStatus = data.status; // Can be "begin", "complete" and "success".

    switch (ajaxStatus) {
        case "begin": // This is called right before ajax request is been sent.
            buttonElement.disabled = true;
            break;

        case "complete": // This is called right after ajax response is received.
            // We don't want to enable it yet here, right?
            break;

        case "success": // This is called when ajax response is successfully processed.
            buttonElement.disabled = false;
            break;
    }
}
BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
  • I can't get handleDisableButton to execute. For some reason onevent doesn't fire. :| – Mark13426 Nov 03 '11 at 20:33
  • What JSF impl/version are you using? Are you using JSP or Facelets? (i.e. are you using `.jsp` or `.xhtml` files?) You initially tagged the question with JSP, but then the `` wouldn't work at all without hacking one and other. – BalusC Nov 03 '11 at 20:51
  • I'm using .xhtml files and JSF 2.0 – Mark13426 Nov 04 '11 at 15:06
  • You are not entirely clear about JSF impl/version. You just mentioned the JSF spec version. I was asking for impl (Mojarra or MyFaces or whatever and its version). It works fine for me on Mojarra 2.0.6 and 2.1.3 (although it would surprise me if it wouldn't work on older versions). – BalusC Nov 04 '11 at 15:09
  • Well, I've used `onevent` handler on early JSF versions already, definitely also with Mojarra 2.1.1. Perhaps your JS code has just a syntax error. What exactly did you edit from my answer? What exactly does the webbrowser's JS parser/console say? – BalusC Nov 04 '11 at 15:17
  • I kept your function the same except I added alert("enabled"); and alert("disabled"); statements. Chrome tells me handleDisableButton is not defined when I click the button. I added the function like so: inside the head element – Mark13426 Nov 04 '11 at 15:26
  • Uncaught ReferenceError: handleDisableButton is not defined – Mark13426 Nov 04 '11 at 15:36
  • Chrome doesn't eat `<![CDATA[` on `text/html` responses. Either remove it altogether (the given script doesn't contain any to-be-escaped XML special characters anyway), or comment the CDATA start and end lines away by `//`, or -better!- just put JS code in its own `.js` file. – BalusC Nov 04 '11 at 15:40
  • I fixed it. Apparently, all JS code between tags is ignored by our program. We had to add an external JS file like so and your function worked. Thanks! – Mark13426 Nov 04 '11 at 16:29
0

If you use richfaces, the a4j:commandButton has the status attribute which prevent this.

OliverLJ
  • 41
  • 4