rxmnnxfpvg
rxmnnxfpvg

Reputation: 31003

How do I get the select box values in YUI 3?

In YUI 3 I have a node that is my select box:

Y.get('#regionSelect');

How do I get the <option> values that are currently selected (even if there are more than one?) Also, is there a tutorial out there that tells me explicitly how to do this (I don't want to serialize a whole form)?

Upvotes: 8

Views: 16008

Answers (4)

Cam Song
Cam Song

Reputation: 2954

You can directly use this. Require selector-css3 module to support IE.

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

http://jsfiddle.net/neosoyn/r8crW/

Upvotes: 1

Ruslan Kabalin
Ruslan Kabalin

Reputation: 6908

You might not need to iterate through all options if you need just a selected one:

var index = Y.get("#regionSelect").get('selectedIndex');
var value = Y.get("#regionSelect").get("options").item(index).getAttribute('value');

Upvotes: 5

Jarod Law Ding Yong
Jarod Law Ding Yong

Reputation: 5757

// Selected Value

  • Y.one('#regionSelect')._node.value;
  • Y.one('#regionSelect').get('value');

// Selected Index

  • Y.one('#regionSelect')._node.selectedIndex;
  • Y.one('#regionSelect').get('selectedIndex');

Upvotes: 8

seth
seth

Reputation: 37287

Once you have the selector, you can chain get and each

Y.get("#regionSelect").get("options").each( function() {
   // this = option from the select
   var selected = this.get('selected');
   var value  = this.get('value');
   var text = this.get('text');
   // apply secret sauce here
});

I've just been using the demos/examples on http://developer.yahoo.com/yui/3/ to figure things out.

Upvotes: 12

Related Questions