197

I'm trying to select this element which has square brackets in the name attribute:

<input type="text" name="inputName[]" value="someValue">

I've tried this (which doesn't work):

$('input[inputName[]=someValue]')

and neither does this:

$('input[inputName&#91;&#93;=someValue]')

or this:

$('input["inputName[]"=someValue]')

EDIT: As some of you have pointed out, $('input[inputName=someValue]') would never work. What I was trying to do was: $('input[name=inputName][value=someValue]'). (But with [] in the name attribute).

0

5 Answers 5

286

Per the jQuery documentation, try this:

$('input[inputName\\[\\]=someValue]')

[EDIT] However, I'm not sure that's the right syntax for your selector. You probably want:

$('input[name="inputName[]"][value="someValue"]')
2
  • 35
    Good catch. The reason for needing two backslashes is because a single backslash is interpreted as a JavaScript string escape character, so you need two to specify a literal backslash, which provides the escape character to the selector... ah, the joys of multiple levels of character escaping.
    – Peter
    Mar 2, 2010 at 17:04
  • Thank you for that. It is just a matter of using regular expressions. This is very useful when submitting form data directly to an array or list within your favorite view framework. That also helped me answering the question about deleting objects with multiple primary key elements. ;) Oct 23, 2014 at 15:12
86

You can use backslash to quote "funny" characters in your jQuery selectors:

$('#input\\[23\\]')

For attribute values, you can use quotes:

$('input[name="weirdName[23]"]')

Now, I'm a little confused by your example; what exactly does your HTML look like? Where does the string "inputName" show up, in particular?

edit fixed bogosity; thanks @Dancrumb

2
  • 1
    I am not able to select (coincidentally a select tag) <select name="foo[bar]"> using $('select[name=foo\\[bar\\]]') however I am able to do so using $('select[name="foo[bar]"]), you second suggestion.
    – Frank N
    Jan 30, 2013 at 14:00
  • This answer should be at the top. Its easiest. Switched quotes and it worked for me. Thanks Nov 20, 2020 at 2:55
54

The attribute selector syntax is [name=value] where name is the attribute name and value is the attribute value.

So if you want to select all input elements with the attribute name having the value inputName[]:

$('input[name="inputName[]"]')

And if you want to check for two attributes (here: name and value):

$('input[name="inputName[]"][value=someValue]')
0
7

If the selector is contained within a variable, the code below may be helpful:

selector_name = $this.attr('name');
//selector_name = users[0][first:name]

escaped_selector_name = selector_name.replace(/(:|\.|\[|\])/g,'\\$1');
//escaped_selector_name = users\\[0\\]\\[first\\:name\\]

In this case we prefix all special characters with double backslash.

2
  • 1
    selector.replace(/([|])/g,'\\\\$1'); worked a little better for me because it adds the escaped slashes and produces two, not one escape slash...
    – Fydo
    Nov 2, 2013 at 3:12
  • @Fydo just remember that you also need to escape some other characters including colons, periods as well Nov 28, 2014 at 23:35
3

Just separate it with different quotes:

<input name="myName[1][data]" value="myValue">

JQuery:

var value = $('input[name="myName[1][data]"]').val();

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.