Loop through elements in a form using Jquery

attributes, javascript, jquery, loops

Solution

you can try:

$('#basic_profile').find(':input').each(function(){

});

This will select all input ,selects, textarea etc.

Problem

How can i loop through every elements in a form. i want to store the name if any update happens for the element. My code working correctly for input types. But i didn't get desired output incase of select field. ``` <html> <form method="post" action="" id="basic_profile" class="basic_profile"> <fieldset class="lang_content" dir="ltr" id="fieldset-en"> <legend>English</legend> <dl> <dd> <select id="cardtype" name="cardtype"> <option value="debit-0.00-50.00">Debit1</option> <option selected='selected' value="debit-0.00-50.00">Debit2</option> <option value="debit-0.00-50.00">Debit3</option> <option value="Credit-1.00-50.00">CreditCard</option> </select> </dd> <dt id="business_name_en-label"><label class="optional" for="business_name_en">Profile Name / Business Entity Name</label></dt> <dd id="business_name_en-element"> <input type="text" value="New Tesr" id="business_name_en" name="business_name_en"> </dd> <dt id="description_en-label"><label class="optional" for="description_en">Description</label></dt> <dd id="description_en-element"> <textarea cols="50" rows="4" id="description_en" name="description_en">new test description</textarea> </dd> <dt id="contact_person_en-label"><label class="optional" for="contact_person_en">Contact Name</label></dt> <dd id="contact_person_en-element"> <input type="text" value="New test" id="contact_person_en" name="contact_person_en"> </dd> <dt id="street_en-label"><label class="optional" for="street_en">Street</label></dt> <dd id="street_en-element"> <input type="text" value="" id="street_en" name="street_en"> </dd> <dt id="area_en-label"><label class="optional" for="area_en">Area</label></dt> <dd id="area_en-element"> <input type="text" value="" id="area_en" name="area_en"> </dd> </dl> </fieldset> <input type="submit" value="Save" id="save" name="save"> </form> </html> ``` And my jquery is: ``` <script type="text/javascript"> $("#save").click(function() { var info = ''; $("#basic_profile dl dd ").each(function() { if (this.defaultValue !== this.value) if (info === '') info += this.name; else info += ',' + this.name; }); alert(info); $('#form_info').val(info); return false; }); </script> ```

Original source