jQuery selector for a checkbox that contains certain text in its name attribute

Question

I'm trying to find a selector in jQuery that select all inputs that are checkboxes and their name contains a specific word like "top" or "Top". Having trouble b/c its selecting other checkboxes.

Is it possible to use something like:

$("input[name*='top'] type:checkbox").each etc?

Top 1<input type="checkbox" name="Top1" /><br />
Top 2<input type="checkbox" name="Top2" /><br />
Top 3<input type="checkbox" name="Top3" /><br />
Top 4<input type="checkbox" name="Top4" /><br />

Bottom 1<input type="checkbox" name="Bottom1" /><br />
Bottom 2<input type="checkbox" name="Bottom1" /><br />
Bottom 3<input type="checkbox" name="Bottom1" /><br />
Bottom 4<input type="checkbox" name="Bottom1" /><br />

I only want to select the check boxes which contian the word "top" in its name.

kapa · Accepted Answer · 2012-07-05 18:06:39Z

14

You were close...

$("input[type='checkbox'][name^='Top']").each()

jsFiddle Demo

edited Jul 5, 2012 at 18:06

kapa

78.9k21 gold badges166 silver badges178 bronze badges

answered Jul 5, 2012 at 17:56

Mark K

6011 gold badge4 silver badges13 bronze badges

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

5 Comments

MilkyWayJoe Over a year ago

I think these selectors are case sensitive, aren't they?

RetroCoder Over a year ago

So I just add two of the box selectors? And ^='Top' translates to Top or top?

MilkyWayJoe Over a year ago

@MarkK just another note, for case insensitive you can use .filter()

kapa Over a year ago

@RetroCoder It is case-sensitive. If you write ^='Top', it will match Top but not top.

Mark K Over a year ago

@bažmegakapa demo always helps thanks NOTE: *='Top' is case-sensitive as well (I didn't know that)

Ram · Accepted Answer · 2012-07-05 17:58:33Z

7

you can use start with selector:

$("input[name^='Top']")

or:

$("input[name^='Top']:checkbox")

edited Jul 5, 2012 at 17:58

answered Jul 5, 2012 at 17:52

Ram

145k16 gold badges174 silver badges201 bronze badges

1 Comment

kapa Over a year ago

Please note that :checkbox is deprecated.

Community · Accepted Answer · 2017-05-23 11:59:09Z

5

I believe you could combine the :checkbox selector and the attribute-contains selector:

$("input:checkbox[name*='top']").each();

Not sure if it needs to be case insensitive, in that case you could have a look at this SO question.

Update:

As bažmegakapa points out in his comment, :checkbox selector is deprecated according to the documentation. Therefor it is probably better to use:

$("input[type=checkbox][name*='top']").each();

edited May 23, 2017 at 11:59

CommunityBot

11 silver badge

answered Jul 5, 2012 at 17:55

Christofer Eliasson

34k7 gold badges77 silver badges103 bronze badges

2 Comments

kapa Over a year ago

From the manual: The bare $(':checkbox') is equivalent to $('*:checkbox'), so $('input:checkbox') should be used instead.

kapa Over a year ago

And I upvoted. Also, :checkbox is deprecated so it might be better to use [type="checkbox"].

Collectives™ on Stack Overflow

jQuery selector for a checkbox that contains certain text in its name attribute

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related