Accessing the array values of dropdownbox using JQuery

Question

<select size="6" name="operator[]" id="operator[]" size="5" multiple="">
    <option value="1" >One</option>
    <option value="2" >Two</option>
    ....
    ....
    <option value="10" >Ten</option>
</select>

My question now is how can I access the array values of dropdownbox using jquery?

$("#operator").val(); // Not working
$("#operator[]").val(); // Not working as well

Anyway to avoid using `[]` in ID ??? – Riz Sep 20 '12 at 08:27 — Riz, Sep 20 '12 at 08:27

score 1 · Answer 1 · answered Sep 20 '12 at 08:30

1

This is not valid id and name property, use this code:

$("#operator").find('option:selected').each(function(){
    alert(this.value);
});

demo: jsfiddle.net/VYjEM/

answered Sep 20 '12 at 08:30

webdeveloper

16,626
3
46
47

More data: [What are valid values for the id attribute in HTML?](http://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html) – webdeveloper Sep 20 '12 at 08:39

score 1 · Answer 2 · answered Sep 20 '12 at 08:30

1

$("select[name='operator[]']").val();

Example: http://jsbin.com/eqoyes/1/edit

answered Sep 20 '12 at 08:30

Riz

8,611
7
33
52

score 0 · Answer 3 · answered Sep 20 '12 at 08:28

The syntax $("select").val() will give you the values of the selected options. If you want to get hold of all the options, use $("select > option").

Also: using the characters [] in the id attribute is illegal in HTML 4 and it does not buy you anything particular; you should probably fix that.

Clyde Lobo · Answer 4 · 2012-09-20T09:26:46.917

0

You will have to escape the [ and ] using \\

$("#operator\\[\\]").val();

or you can use $("select[id='operator[]']").val()

Demo

edited Sep 20 '12 at 09:26

answered Sep 20 '12 at 08:28

Clyde Lobo

8,747
6
34
58

score 0 · Answer 5 · answered Sep 20 '12 at 08:29

First things first. I think it is not allowed to use an array for element id. With that being said, set the element id to 'operator' rather than 'operator[]'.

After you've done that, you can get the options in several ways:

Using the element dom id:
```
$('#operator option');
```
Using the element dom type:
```
$('select option');
```
Using both (recommended):
```
$('select#operator option');
```

More information about the selectors jQuery supports can be found at the official website.

Accessing the array values of dropdownbox using JQuery

5 Answers5