Javascript 有没有办法在呈现ajax响应之前禁用命令链接

Javascript 有没有办法在呈现ajax响应之前禁用命令链接,javascript,ajax,jsf-2,Javascript,Ajax,Jsf 2,我们有单选按钮,ajax要求更改单选按钮的值 <h:selectOneRadio id="name" value="#{nameTO.suffix}"> <f:ajax render="fname lname"/> <f:selectItems value="#{optionValues['suffix']}" /> </h:selectOneRadio> 如果用户选择一个不同的值,aja

我们有单选按钮,ajax要求更改单选按钮的值

<h:selectOneRadio id="name" value="#{nameTO.suffix}">           
        <f:ajax render="fname lname"/>
        <f:selectItems value="#{optionValues['suffix']}" />
</h:selectOneRadio>

如果用户选择一个不同的值,ajax调用会有延迟,同时用户单击submit form并将空值传递到后端(因为页面上没有显示字段)


有没有办法在呈现ajax响应之前禁用命令链接?

是的,当然有。您只需要通过一个命令按钮来更改命令链接,因为JSF命令链接并不是可以通过JS方式轻易禁用的。如果有必要,您可以添加一些CSS以使按钮看起来更好

一旦这样做了,您就可以利用
来监听ajax事件。在ajax请求开始时,您可以禁用命令按钮。ajax请求成功后,您可以重新启用命令按钮

因此,给出这个事件函数侦听器示例

function handleDisableButton(data) {
    var button = document.getElementById("formId:buttonId");

    switch (data.status) {
        case "begin": // This is called right before ajax request is been sent.
            button.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 right after update of HTML DOM.
            button.disabled = false;
            break;
    }
}
或者更简短,但对于初学者来说可能更难理解:

function handleDisableButton(data) {
    document.getElementById("formId:buttonId").disabled = (data.status != "success");
}
您可以按如下方式执行所需的要求:

<f:ajax ... onevent="handleDisableButton" />