Question

I have a quick question that I need some help with if possible. Am I able to have more than one input with the same id and loop through the values of these? Something similar to the code below:

<p>ID:<input name="check_id" type="hidden" id="check_id"  value="1"/></p>
        <p>ID:<input name="check_id" type="hidden" id="check_id"  value="2"/></p>

jQuery("#check_id").each(function(){
var check_data = jQuery(this).val();
alert(check_data); 
});

Thanks

Paul

Answer 1

No. IDs must be unique. You will likely only select the first.

You could possibly do something like this, though it is less efficient:

jQuery("input[id=check_id]").each(function(){
    var check_data = jQuery(this).val();
    alert(check_data); 
});

But if you’re going to do that, you might as well fix your IDs to be unique, and select by the name attribute.

jQuery("input[name=check_id]").each(function(){
    var check_data = jQuery(this).val();
    alert(check_data); 
});

If all the <input> elements you want are contained in a container, you could speed things up by specifying that container.

jQuery("#myContainer input[name=check_id]").each(function(){
    var check_data = jQuery(this).val();
    alert(check_data); 
});

This code example presumes there is a common ancestor with the ID myContainer.

---

EDIT: With regard to your question in the comment below, return false; inside an .each() loop only exits the loop. You could however set a flag that will tell the subsequent code whether or not to execute.

Something like this:

var shouldContinue = true;

jQuery("#myContainer input[name=check_id]").each(function(){
    var check_data = jQuery(this).val();
    if( someCondition ) {
        shouldContinue = false; // signal to not execute subsequent code
        return false;  // Halt the loop
    }
});

if( shouldContinue ) {
     // execute code if shouldContinue is true
}