Как отключить кнопку Ladda?

Question

Я использую интерфейс Ladda для бутстрапа.

Использование jquery Я пытаюсь отключить кнопку после того, как пользователь нажмет на нее.

Я попытался использовать ajax OnComplete/OnSuccess/OnBegin, но безрезультатно - кнопка остается включенной.

Если я поменяю разметку вручную на firebug - я могу отключить его. Также обратите внимание на js fire.

Вот разметка:

<a id="icalSync" href="/iCal/iCalCreatedLinks" data-ajax-method="GET" data-ajax-complete="AjaxOnCompleteDisableButton" data-ajax="true" data-style="expand-left" class="btn ladda-button"> 
<span class="ladda-label">Sync iCal</span> 
<span class="ladda-spinner"></span> 
</a> 

Вот функция JS:

function AjaxOnCompleteDisableButton() { 
    $("#icalSync").attr("disabled", true); 
} 

Я был бы признателен за любую помощь по этому вопросу.

Answer 1

отключения не действует с якорными тегами, так что вы можете попробовать это:

function AjaxOnCompleteDisableButton() { 
event.preventDefault(); 
} 

или изменить возможную ваш на # icalSync на кнопку и использовать код

<button id="icalSync" href="/iCal/iCalCreatedLinks" data-ajax-method="GET" data-ajax-complete="AjaxOnCompleteDisableButton" data-ajax="true" data-style="expand-left" class="btn ladda-button"> 
<span class="ladda-label">Sync iCal</span> 
<span class="ladda-spinner"></span> 
</button> 

или вы могли бы добавьте класс disabled, используемый в bootstrap:

function AjaxOnCompleteDisableButton() { $("#icalSync").addClass("disabled"); } 

Answer 2

Ваша «кнопка» на самом деле не кнопка. Вам нужно подойти по-другому. Либо сделайте его <button>, либо в AjaxOnCompleteDisableButton присвойте ему класс, который заставит его выглядеть так, как будто он отключен (например, непрозрачность: 0,5) и игнорирует инициирующие события на нем.