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.

score 11 · Accepted Answer · edited Jul 05 '12 at 18:06

11

You were close...

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

jsFiddle Demo

edited Jul 05 '12 at 18:06

kapa

75,446
20
155
173

answered Jul 05 '12 at 17:56

Mark K

571
1
3
13

1

I *think* these selectors are case sensitive, aren't they? – MilkyWayJoe Jul 05 '12 at 17:58
So I just add two of the box selectors? And ^='Top' translates to Top or top? – RetroCoder Jul 05 '12 at 18:01
3

@MarkK just another note, for case insensitive you can use [`.filter()`](http://api.jquery.com/filter/) – MilkyWayJoe Jul 05 '12 at 18:08
@RetroCoder It is case-sensitive. If you write `^='Top'`, it will match `Top` but not `top`. – kapa Jul 05 '12 at 18:09
@bažmegakapa demo always helps thanks NOTE: *='Top' is case-sensitive as well (I didn't know that) – Mark K Jul 05 '12 at 18:11

Ram · Answer 2 · 2012-07-05T17:58:33.637

5

you can use start with selector:

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

or:

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

edited Jul 05 '12 at 17:58

answered Jul 05 '12 at 17:52

Ram

140,563
16
160
190

Please note that `:checkbox` is deprecated. – kapa Jul 05 '12 at 18:03

score 5 · Answer 3 · edited May 23 '17 at 11:59

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 '17 at 11:59

Community

1
1

answered Jul 05 '12 at 17:55

Christofer Eliasson

31,342
6
71
100

2

From the manual: `The bare $(':checkbox') is equivalent to $('*:checkbox'), so $('input:checkbox') should be used instead.` – kapa Jul 05 '12 at 18:04
And I upvoted. Also, `:checkbox` is deprecated so it might be better to use `[type="checkbox"]`. – kapa Jul 05 '12 at 18:08

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

3 Answers3

Linked

Related