jquery loop through element and select specific one

Question

I'm pretty new to jquery so bear with me. I'm currently looping through a set of form elements and trying to select a specific one and do something with it. I'm running into some troubles and just can't figure this out. My below code loops through all the form elements and I'm trying to target an input field with an id of zip code and do some special zip code validation with it. Except it hits the zip code validation first (even though it's the 3rd input element) and validates it then goes through all the other form elements and validates the zip code a second time. How would I prevent a) the zip code validation being hit twice and b) zip code not being the first input element validated but instead being the 3rd.

$("#homeForm :input").each(function(){

    if($("#zipCode").val().length == 0){
    //do some zip code validation
    } 

    if($(this).val().length == 0 && $(this).is(":visible")){             
    //do some regular validation
    }       

});

My html is here:

<form id="homeForm>
   <input type="text" name="fullName" id="fullName" />
   <input type="text" name="homePhone" id="homePhone" />
   <input type="text" name="zipCode" id="zipCode" />
   <input type="text" name="age" id="age" />
   <input type="text" name="homeTown" id="homeTown" />
</form>

Newbie here and any help is greatly appreciated.

should'nt that be if( this.id == 'zipCode' && !this.value.length) as the zipcode element is probably part of the form and is already being iterated, otherwise you validate the zipcode element on each and every iteration. — adeneo
– adeneo, Commented May 12, 2013 at 0:16

adeneo · Accepted Answer · 2013-05-12 00:26:38Z

2

$("#homeForm input").each(function(){
    if (!this.value.length) {
        if (this.id == 'zipCode') {
            //do some zip code validation
        }else if ( $(this).is(":visible") ) {
            //do some regular validation
        }       
    }
});

This prevents :

a) the zip code validation being hit twice and

b) zip code not being the first input element validated but instead being the 3rd.

You do of course realize you only do the validation if nothing is inputted, i.e. the elements value has no length (you're checking if the length is zero), so I would probably remove the not (!) in the code above to reverse that functionality, as you probably want to run the validation when there is an input ?

edited May 12, 2013 at 0:26

answered May 12, 2013 at 0:21

adeneo

319k29 gold badges410 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Delmon Young Over a year ago

thanks @adeno worked like a charm. Sorry but I'm really lost on why this works. Any light you can shed would be great.

adeneo Over a year ago

It just loops thru all the inputs in order, first checking the length, then checking if the ID is zipCode, and if it is, well, does the zipCode thing, and if not, checks if it's visible, then does the regular thing.

Collectives™ on Stack Overflow

jquery loop through element and select specific one

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related