Question

I am using an Ajax request to post a form with Jquery.

$.ajax( 
        { 
            type: "POST", 
            url: "login.php", 
            data: $("#signin").serialize(),
            dataType: "json",
            cache: false,
            success: function(data, textStatus) {
                if (data.redirect) {
                    window.location.replace(data.redirect);
                }
                else {
                    $('#some').fadeOut(200);
                    $('#some2').fadeIn(200);
                    $("#some3").html(data.form);
                    $("#some").delay(2000).fadeOut(200);
                    $('#some2').delay(2800).fadeIn(300);
                }
            }           
        });

Now the ajax request will take place as soon as you click on a button “Login”. The problem now is that if you press the button more than once the else case will be executed several times which will cause #some, #some2 and #some3 to fade out and in several times. So how could I check whether the request has allready been sent (without having to write something into my db)?

Answer 1

From here:

You can use .one() method and set it again in ajax callback.

function doAjax(){
    // Your Ajax call.
    $.ajax({..., complete: function() {
        // Ajax call done, re-enabling the button/link
        $("#buttonId").one('click', doAjax);
    }, ...});
}

$("#buttonId").one('click', doAjax);