在ajax事件上禁用/启用命令按钮

Question

我希望能够在命中按钮命中按钮一旦它被命中,并在事件监听器运行并启用msg1后启用它.

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

我怎么能这样做？

更新:我发现我可以将onclick事件附加到commandButton元素本身来禁用它.如何检测侦听器方法已返回,以便我可以再次启用该按钮？

Answer 1

你可以借助于指向处理JSF Ajax事件的JavaScript函数的onevent属性来完成它<f: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;
    }
}