CODEWITHSUNDEEP
ajaxjquery
Jason
Jason

Reputation: 7682

ajax call after x characters

I have an ajax call triggering on the maxlength of an input. However, it continues to trigger if a user continues to enter characters (because they count as a keypress). Is there any way to prevent additional ajax calls after the 5 character limit?

html

<input type="text" value="" id="billZipCode" name="billZipCode" class="smallInput coreAddrBill" maxlength="5">

javascript

//show city/state on input maxlength
$("input#billZipCode").live("keyup", function( event ){
    if(this.value.length == this.getAttribute('maxlength')) {
        if ($(this).valid() == true ) {
            zipLookup(this, "USA");

        }
    }
});

Upvotes: 3

Views: 4923

Answers (3)

jackwanders
jackwanders

Reputation: 16040

Set a .data attribute on the field:

//show city/state on input maxlength
$("input#billZipCode").live("keyup", function( event ){

    if(this.value.length == this.getAttribute('maxlength')) {
        if(!$(this).data('triggered')) {
            // set the 'triggered' data attribute to true
            $(this).data('triggered',true); 
            if ($(this).valid() == true ) { zipLookup(this, "USA"); } 
        }
    } else { $(this).data('triggered',false); }

});

Move the assignment inside the second if statement if you want to keep running this until the zipcode is valid.

Upvotes: 2

Ram
Ram

Reputation: 144709

Try this:

var ready = true;
$("input#billZipCode").on("keyup", function( event ){
    if(this.value.length == this.getAttribute('maxlength')) {
        if ($(this).valid() && ready) {
            zipLookup(this, "USA");
            ready = false;  
        }
    }
});

Upvotes: 0

kgautron
kgautron

Reputation: 8273

Use a boolean variable to know if a call has already been triggered (init it to false, assert it is still false before making a call, and set it to true when you make the call).

Upvotes: 0

Related Questions