Отключить / включить командную кнопку для события ajax

Question

Я хочу иметь возможность отключить командную кнопку ниже, как только она нажата, и включить ее, когда прослушиватель событий запускается и отображается msg1.

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

Как я мог это сделать?

ОБНОВЛЕНИЕ: Я обнаружил, что могу прикрепить событие onclick к самому элементу commandButton, чтобы отключить его. Как я могу определить, что метод слушателя вернулся, чтобы я мог снова включить кнопку?

Answer 1

Вы можете сделать это с помощью атрибута onevent <f:ajax>, который указывает на функцию JavaScript, которая обрабатывает события JSF Ajax.

Например:

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

(обратите внимание, что я также исправил неправильный EL в listener)

с этим 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;
    }
}

Answer 2

Если вы используете richfaces, a4j: commandButton имеет атрибут состояния, который предотвращает это.