charlie
charlie

Reputation: 481

jquery run function on textbox change and timeout

I have this function:

$(document).ready(function() {
    var timeoutId;
    $('#invoices input, #invoices textarea').on('input propertychange change', function() {    
        clearTimeout(timeoutId);
        timeoutId = setTimeout(function() {
            // Runs 1 second (1000 ms) after the last change
            $("#submit").click();
        }, 1000);
    });
});

it runs a function on textbox / textarea change after 1 second but its running the $("#submit").click(); twice. once after change and after focus has been removed from the input

how can i stop this from going twice?

Upvotes: 1

Views: 280

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337723

You also need to clear the timeout within the anonymous function, so that the other events that were raised on the element after the one currently being handled cannot submit the form too. Try this:

var timeoutId;
$('#invoices input, #invoices textarea').on('input propertychange change', function() {    
    clearTimeout(timeoutId); // clear any previously existing timeouts
    timeoutId = setTimeout(function() {
        clearTimeout(timeoutId); // clear any queued timeouts waiting to happen
        $("#submit").click();
    }, 1000);
});

Upvotes: 2

Related Questions