Discover executed event

Question

I made the following command to display a loading every time I perform a project Submit.

$("button[data-noPreload!='true'][type='submit']").click(openPreloading);
function openPreloading() {
    $("#icoCarregando").fadeIn();
}

I found this other code to help fix a failure to close the loading screen when there are errors in filling the form.

$("form").bind("invalid-form.validate", function () {
    $("#icoCarregando").hide();
});

So far everything was working well, the problem that I’m in need of help is when the user of a double click to save a form whose error, the event created above seems to have no effect, thus opening the Loading screen, when debugging I was able to identify that the functions created above are being executed but it seems that this executed some extra event where loads the loading.

Is there any way to identify which event might be running and causing this problem? Or do you know how I might be getting around this failure?

Thank you for your attention!

Answer 1

Does not open twice the icon by double clicking?

Try to change your functions to that way:

var carregando = false;
$("button[data-noPreload!='true'][type='submit']").click(openPreloading);
function openPreloading() {
    if(carregando === false){
        $("#icoCarregando").fadeIn();
        carregando = true;
    }
}

$("form").bind("invalid-form.validate", function () {
    $("#icoCarregando").hide();
    carregando = false;
});