Question

I’m using jQuery Validate for my form validation. I’m making an Ajax call to verify some data and need a way to track how many attempts or calls are made to the server.

For example, the first time a user enters some characters in an input field, then moves out of the field, a call will be made to the server to detect if true or false is sent back. After the first attempt, it will say this was your first attempt.

How can I make it so it will say this was your second attempt after the next try, third, etc? I also need a way to remove the input field altogether after five attempts have been made.

$("#my-form").validate({
    rules : {
        username : {
            required : true,
            remote : "username.php"
        },
    }
});

Answer 1

One way would be to use one of the Global Ajax Event Handlers

$(document).ajaxComplete(function(event, request, settings) {
    var urlToLog = "username.php";

    console.log('Triggered ajaxComplete handler.');

    if (settings.url.indexOf(urlToLog) != -1) {
        console.log('Ajax call for ' + urlToLog + ' completed.');
        // Increment the count here
    }
});

If the same url "username.php" is being used in other AJAX calls as well, you will not get correct count. In that case you may have to make the Url somehow unique or use some other way to know when to count and when not to count.