2010-01-26 13 views
9

Quiere agregar una opción dinámicamente a un elemento Seleccionar usando un prototipo.Agregar una opción a un Elemento seleccionado con javascript usando la biblioteca Prototype

Parece que hay muchas maneras diferentes de hacerlo, todo tiene que ver con options.add, etc. No se ve mucho en el camino de las formas de navegación cruzada.

Quiere que sea lo más ligero posible.

Esto es lo que tengo hasta ahora. Es solo el agregar las opciones en las que estoy atascado:

var oNewOption = new Element('option').value=vItem; 
oNewOption.text=vItem; 

¿Alguna idea de alguien?

¡Gracias de antemano!

Respuesta

11
select.insert(new Element('option', {value: myValue}).update(myLabel)); 

inserción APPENDs al contenido del objeto select, update actualiza el contenido del nuevo objeto de opción.

No es realmente mejor que la forma clásica, sin embargo.

+0

Esto funcionó según lo que quería hacer, aunque por alguna razón .insert() no devolvía el elemento para actualizarse así que: insert (opción) .update (myLabel) no funcionó. Entonces lo cambié a: option.update (myLabel); select.insertar (opción); El trabajo es un placer. – jamesmhaley

+0

Si observa detenidamente, _update_ está en el objeto devuelto por _new_, no el que devuelve _insert_. – Alsciende

+0

¡Este método funciona en IE7! –

25

No hay necesidad de prototipo, que va a ser tan fácil con el siguiente método consagrado que funciona en todos los navegadores de escritorio importante desde mediados de la década de 1990:

// Assuming a select element stored in a variable called 'select' 
select.options[select.options.length] = new Option("Option text", "optionValue"); 
+0

Gracias, pero estaba buscando usar un prototipo ya que el resto del código está usando un prototipo. ¡Tendremos esto en cuenta en el futuro cuando el uso de prototipos no es un requisito! – jamesmhaley

+8

Prototype es solo una biblioteca. No hay necesidad de usarlo para todo, y nada le impide mezclar métodos DOM regulares con su código Prototype. –

+4

+1. 'select.options.add (new Option ('foo', 'bar'))' también es compatible bastante bien. –

Cuestiones relacionadas