36

Suppose I have the following HTML:

<form id="myform">
  <input type='checkbox' name='foo[]'/> Check 1<br/>
  <input type='checkbox' name='foo[]' checked='true'/> Check 2<br/>
  <input type='checkbox' name='foo[]'/> Check 3<br/>
</form>

Now, how do I select the checked input fields with name 'foo[]'?

This is my attempt, but it doesn't work:

$("#myform input[name='foo']:checked:enabled");
bart
  • 14,958
  • 21
  • 75
  • 105
  • Umn, what you have there works just fine, just use double quotes around your selector. :) – cgp Apr 14 '09 at 14:06
  • 1
    Yes; be aware my initial answer is not the best way of doing this. jQuery used to have problems with brackets in the selector but this has been fixed, so you should be able to keep what you have, just use double quotes around the selector. – Paolo Bergantino Apr 14 '09 at 14:40

4 Answers4

55

The name of the field isn't foo, it is foo[]. You could use the attributeStartsWith selector:

$("input[name^='foo']:checked:enabled",'#myform');

Ideally, you'd be able to do this:

$("input[name='foo[]']:checked:enabled",'#myform');

But as this answer explains, jQuery uses this to parse the value part of the attr=value condition:

(['"]*)(.*?)\3|)\s*\]

\3 being the group containing the opening quotes, which weirdly are allowed to be multiple opening quotes, or no opening quotes at all. The .*? then can parse any character, including quotes until it hits the first ‘]’ character, ending the match. There is no provision for backslash-escaping CSS special characters, so you can't match an arbitrary string value in jQuery.

In other words, as soon as jQuery hits the first ] it thinks the value is over. So you are stuck with startsWith or using pure DOM elements, as that answer also explains.

SUPER DUPER IMPORTANT EDIT:
This bug is fixed, apparently. You should be able to use the code I described as "ideal", above.

Community
  • 1
  • 1
Paolo Bergantino
  • 480,997
  • 81
  • 517
  • 436
  • I believe, that this is the bug and it's related fix: http://dev.jquery.com/ticket/3443 – cgp Apr 14 '09 at 14:25
  • It's not fixed in jQuery 1.3.2, which appears to be the latest generally available version. – bobince Apr 14 '09 at 15:26
5

You should quote the attribute when selecting and include []:

$("#myform input[name='foo[]']:checked:enabled");
Seb
  • 24,920
  • 5
  • 67
  • 85
  • 1
    This won't work, unfortunately. The jQuery parser ends at the first ] it encounters, so [] aren't allowed in this case. – Paolo Bergantino Apr 14 '09 at 14:02
  • 1
    Indeed. This is a bug; see http://stackoverflow.com/questions/739695 for discussion. – bobince Apr 14 '09 at 14:05
  • An old bug. It's fixed if you're using the latest version appraently, as you can see my example shows. – cgp Apr 14 '09 at 14:14
  • My comment there was about the latest version (at the time of writing: 1.3.2). The regex used to parse attr selectors is pretty much totally broken in this version. Maybe a fix will be forthcoming later. – bobince Apr 14 '09 at 15:27
1

Actually, what you have works just fine, just use double quotes, and include the brackets so it can match.

 $("#myform input[name='foo[]']:checked:enabled");

You can see it in action here: http://jsbin.com/oyoro

Note that jQuery has had issues on and off with brackets in the past, which can explain a lot of the confusion surrounding the need for escaping. I know I've had issue myself with brackets and just quoting.

See: http://dev.jquery.com/ticket/3443

Brad Larson
  • 170,088
  • 45
  • 397
  • 571
cgp
  • 41,026
  • 12
  • 101
  • 131
0

I believe it goes something like this:

$("input #foo[] :checked");

EDIT: The commenter is right. I should have gone with my first response. :) This time I am going to use the "^".

$("input[name^=foo] :checked");
Tacoman667
  • 1,391
  • 9
  • 16