Stephen
Stephen

Reputation: 2560

YUI 3: Getting the selected option's text

I am working with YUI 3, coming from jQuery, but I have a question about YUI usage.

I have a select tag with some option tags:

 <select id="ownerSelector">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
 </select>

I want to get the selected option's text.

Is there anything resembling jQuery's $('option:selected') extension in YUI 3?

I saw this over at http://www.jsrosettastone.com/#selectors that a way to do this is Y.all('option[selected]'), but that doesn't work. (Either that, or I don't know which YUI module the [] selector syntax belongs to.)

If there is no shortcut, I noticed that when I query Y.all('#ownerSelector option'), I can see the NodeList array, and one of the options has a property called 'selected'. Is there a way to get at the selected option?

Upvotes: 3

Views: 4348

Answers (3)

einarq
einarq

Reputation: 535

I think this is what you're looking for:

YUI().use("selector-css3", "node", function (Y) {
    var text = Y.one("#ownerSelector option:checked").get("text");
});

http://jsfiddle.net/aqPus/2/

Upvotes: 5

user32225
user32225

Reputation: 914

Y.one('#ownerSelector').get('value')

Upvotes: 1

Stephen
Stephen

Reputation: 2560

It doesn't look like YUI 3 supports selector shortcuts. This is what I could find on the YUI forums.

 var node = Y.one('#ownerSelector');
 node.get('options').item(node.get('selectedIndex')).get('text');

Upvotes: 3

Related Questions