jQuery looping thru hidden fields by ID

JavaScript
1

Hi

I want to loop thru all the hidden fields on the page, that have an ID which starts with “general_” and ends in “_10”.
Eg IDs:
id = “general_name_10”
id = “general_link_10”
id = “general_price_10”

How can I do such a loop in jQuery?

Thanks

2

You could probably use something like the following example wrote just now.

$(function() {
    $('[id^="general"]').each(function() {
        if (this.id.match(/general_(.*)_10/i)) {
            // Do something
        }
    });
});
3

Thanks, is there anyway of restricting the loop to only loop thru matching IDs (general_(.*)_10)?

4

Do you mean as in using the names you listed?

this.id.match(/general_(name|link|price)_10/i)
5

Ahh nope :slight_smile:

I meant is something like this possible:


 $('[id^="/general_(.*)_10/i)"]').each(function() {        
            // Do something       
    });

rather than


$(function() {
    $('[id^="general"]').each(function() {
        if (this.id.match(/general_(.*)_10/i)) {
            // Do something
        }
    });
});
6

No, jQuery expressions are limited to what they can handle which is the reason i used the loop and regular expression.

7

Ok, thanks. Then would somethign like this be possible?


var product = 10;
jQuery(function() {
				jQuery('[id^="general"]').each(function() {
					if (this.id.match('/general_(.*)_'+product +'/i')) {
						alert(jQuery(this).val());
					}
				});
			});

because ultimately I want this to be within an outer loop (looping thu product ids)

Thanks again
Cheers

8

That should work fine

9

Hmm, just put it to the test:


var product = 10
jQuery(function() {
                jQuery('[id^="general"]').each(function() {
                    if (this.id.match('/general_(.*)_'+product+'/i')) {
                        alert(jQuery(this).val());
                    }
                });
            });
  • didn’t work. But if the 10 is hardcoded in the match it works:

//var product = 10 This is hardcoded below.
jQuery(function() {
                jQuery('[id^="general"]').each(function() {
                    if (this.id.match(/general_(.*)_10/i)) {
                        alert(jQuery(this).val());
                    }
                });
            });

Hopefully can get it work without it being hardcoded.
:frowning:

10

I did a bit of light reading on dynamic regular expressions and hopefully this should work

this.id.match(new RegExp('general_(.*)_' + product, 'i'))
11

Thanks so much, that worked a treat.

12

No problem :slight_smile:

13

Wanting to expand on this a bit now, something like:


jQuery(function() {
				jQuery('[id^="(general|requirements)"]').each(function() {																
					if (this.id.match(new RegExp('(general|requirements)_(.*)_' + product, 'i'))) {						
						
						// Do something
					}
				});
			});

Note the (general|requirements) - so where it ID starts with either “general” or “requirements”. Rather than just “general” as we had it before.
However this doesn’t work.

14

Like i said before jQuery is very limited to what its expressions can handle, to loop for multiple id’s simply change what you have to the following…

jQuery('[id^="general"], [id^="requirements"]')
15

Thanks so much again. Works perfectly!!

16

No problem :slight_smile:

17

I’ve come up with a problem with this rule:

this.id.match(new RegExp('(general|requirements)_(.*)_4', 'i')

It matches not only:
general_price_4
it also will find
general_price_44
general_price_45

…if they exist on the page.
Anyway of stopping this?

Thanks much.

18

Give the following a try

this.id.match(new RegExp('(general|requirements)_(.*)_4{1}', 'i')
19

Is it possible to combine attribute_starts_with and [url=“http://api.jquery.com/attribute-ends-with-selector/”]attribute_ends_with selectors?

For example:


jQuery(function($) {
    $('[id^="(general|requirements)"]').each(function () {                                
        $('[id$="_4"]').each(function () {      
            // Do something
        });
    });
});