Getting options by value from select element in jQuery

Question

I want to access the select option jQuery objects as such:

var $options = $('select').children(); var $someOption = $('[value="some_value"]', $options); var $anotherOption = $('[value="another_value"]', $options);

but neither $someOption or $anotherOption look like any of the elements in $('select').

I believe I know how to compose the one line selector but since I'm accessing various options, I wanted to use the $options handle for readability and performance instead.

What is wrong with the code and/or rationale?

Did you accidentally exclude the $ from the selectors for $someOption and $anotherOption? — Explosion Pills
– Explosion Pills, Commented Jan 28, 2013 at 23:47
You seem to be missing the $ for the jQuery function on your second and third selectors. — jmoerdyk
– jmoerdyk, Commented Jan 28, 2013 at 23:47
@ExplosionPills, jmoerdyk, thank you, I now fixed the OP typos. — juanchito
– juanchito, Commented Jan 29, 2013 at 18:37

Joseph Silber · Accepted Answer · 2013-01-28 23:51:12Z

5

You have to use jQuery's filter method:

var $options = $('select').children(); var $someOption = $options.filter('[value="some_value"]'); var $anotherOption = $options.filter('[value="another_value"]');

answered Jan 28, 2013 at 23:51

Joseph Silber

221k59 gold badges369 silver badges293 bronze badges

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

2 Comments

Justin Bicknell Over a year ago

Passing in a jQuery object as the second parameter acts as the context to select from, so it does the same thing as your code EDITED (this statment is incorrected)

Joseph Silber Over a year ago

@JustinBicknell - Nope. Passing in a context searches for descendants, and is equivalent to this: $options.find('[value="some_value"]')

Barmar · Accepted Answer · 2013-01-29 00:15:04Z

1

In order to use the context parameter, don't call .children().

var $select = $('select'); var $someOption = $('[value="some_value"]', $select); var $anotherOption = $('[value="another_value"]', $select);

answered Jan 29, 2013 at 0:15

Barmar

789k57 gold badges555 silver badges669 bronze badges

4 Comments

Joseph Silber Over a year ago

This'll traverse the DOM each time. Filtering only looks at the set being filtered.

Barmar Over a year ago

@JosephSilber True, although it only has to traverse the subset of the DOM below the select, not the entire DOM, so it's not too bad.

Joseph Silber Over a year ago

True, but what benefit does it offer over filtering?

Barmar Over a year ago

@JosephSilber It's less verbose, some may find it more readable, which is one of the criteria the OP is looking for.

Collectives™ on Stack Overflow

Getting options by value from select element in jQuery

2 Answers 2

2 Comments

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Related