2009-08-07 14 views
31

decir que tengo un formulario HTML que contiene este elemento select:¿Cómo selecciono una opción mediante prototipo

<select name="mySelect" id="mySelect"> 
    <option value="1" id="option1">1</option> 
    <option value="2" id="option2">2</option> 
    </select> 

¿Cómo puedo usar prototipo para seleccionar uno de los elementos de opción?

Los métodos enumerados en the API reference of Form.Element no parecen ayudar con esto.

editar: por "seleccionar" me refiero al efecto equivalente del atributo "seleccionado" en un elemento de opción.

Respuesta

33
var options = $$('select#mySelect option'); 
var len = options.length; 
for (var i = 0; i < len; i++) { 
    console.log('Option text = ' + options[i].text); 
    console.log('Option value = ' + options[i].value); 
} 

options es una matriz de todos los elementos de opción en #mySelect desplegable. Si desea marcar uno o más de ellos como seleccionado sólo tiene que utilizar selected propiedad

// replace 1 with index of an item you want to select 
options[1].selected = true; 
+2

Así que básicamente es $ (la "Opción 1") = true seleccionado, a la derecha.? –

+1

Si tiene una identificación para todas sus opciones configuradas, entonces sí, puede hacerlo así. – RaYell

+0

Gracias, entonces haré esto. –

0
var selectThis = 'option1'; 
$$('select#mySelect option').each(function(o){ 
     if(o.id==selectThis){o.selected = true;$break;} 
}); 
15

para obtener la opción seleccionada en ese momento, su uso:

$$('#mySelect option').find(function(ele){return !!ele.selected}) 
+0

Pensé que '.attributes ['selected'] = true;' es lo que necesito, pero el código correcto es '.selected = true;' – llamerr

+0

¡Esto fue muy útil, gracias muchísimo! –

+0

¿Puedes usar '$ ('mySelect'). Value' para obtener el valor? – joshuahedlund

8

Nils Petersohn casi lo hizo bien, pero típicamente, el atributo "id" de la opción no es lo que las personas están seleccionando. este pequeño cambio lo hace funcionar.

var selectThis = 'option1'; 
$$('select#mySelectId option').each(function(o) { 
    if(o.readAttribute('value') == selectThis) { // note, this compares strings 
    o.selected = true; 
    throw $break; // remove this if it's a multi-select 
    } 
}); 
1

Para seleccionar la segunda opción por el valor que se podría utilizar esto:

var myChoice = '2'; 

$$('select#mySelectId option').each(function(o) { 
    o.selected = o.readAttribute('value') == myChoice; 
}); 
1
var itis = $(mySelectId).select('option[value="' + sValueToSelect + '"]'); 
if (itis && itis.length > 0) 
    itis[0].selected = true; 
1

Suponiendo que usted sabe cuál es el valor que desea seleccionar, tratar:

$('mySelect').value = 2; // 2 being the value you want selected 
+0

@JamesWiseman: prototype! = JQuery – mpen

-1

intento esto ...

document.observe('dom:loaded', function() { 
    $('mySelect').observe('change', function(event) { 
    ... 
    }); 
}); 
7

Prueba esto:

$('mySelect').setValue(1); // or whatever value you want to select 

éste seleccionaría option1

+0

¡Gracias, funciona como un encanto! Y si desea seleccionar una opción con el valor seleccionado de otra, seleccione usar: '$ ('select1'). SetValue ($ ('select2'). GetValue())' – joseantgv

Cuestiones relacionadas