Bootstrap Button "Laden" Animation funktioniert am Ende

Question

ich eine Taste, die eine Ajax-Funktion und zeigen Benutzer Informationen in einigen Textfeld ruft

HTML:

<button id="btnUsers" class="btn btn-primary pull-left btn-lg" onclick='navUsers.getUsers();' data-loading-text="<i class='fa fa-spinner fa-spin '></i> Processing Order"> Get Users </button> 
<textarea id="resultUsers" name="resultUsers" cols="100" rows="18" class="form-control"></textarea> 

JS:

var navUsers = new function(){ 
    this.getUsers = function(){ 
     $("#btnUsers").button('loading'); 
     $.ajax({ //ajax stuff, shows users in the textarea }) 
    }; 
}; 

Das Problem ist: Die 'Laden' Animation der Schaltfläche startet nur nach der Ajax-Zeug ist fertig, nicht vorher. Ich habe ein 'modales' Bootstrap-Div ausprobiert, um Mensajes beim Laden von Benutzern anzuzeigen. Auch habe ich die beforesend Option in Ajax versucht, gleiche Ergebnisse.

Answer 1

var navUsers = new function(){ 
    this.getUsers = function(){ 
     $("#btnUsers").button('loading'); 
     setTimeout(function() { 
      $.ajax({ 
      //ajax stuff, 
      success:function(){ 
      $("#btnUsers").button('reset'); 
      } 
     }) 
    }, 1000); 

    }; 
}; 

Answer 2

Haben Sie JavaScript-Rückruffunktionen versucht?