¿Difícil? Crear objeto select

bauhaus1975 · #1 (**permalink**) 25/04/2005, 10:02

Hola a todo el mundo,

¿Cómo puedo crear un objeto select dinámicamente dentro del HTML, pulsando un botón por ejemplo, colocarlo donde quiera con la lista de items que quiera?

¿Difícil?

Un saludo
Miguel.

JavierB · #2 (**permalink**) 25/04/2005, 10:22

Hola bauhaus1975

Lo de difícil o fácil es relativo, como dijo no se quien. Bueno, a lo que importa, el código:

Código PHP:

  <html> 
<head> 
<script type="text/javascript"> 
function crear() { 
  papa=document.getElementById('jose'); 
  sel=document.createElement('select'); //creamos el select 
  opt=document.createElement('option'); //creamos una opcion 
  opt.value='algo'; 
  opt.innerHTML='algo'; 
  sel.appendChild(opt); //añadimos la opcion al select 
  papa.appendChild(sel); //añadilos el select al lugar que queremos 
} 
</script> 
</head> 
<body> 
<div id="jose"> 
</div> 
<input type="button" value="Crear" onclick="crear()" /> 
</body> 
</html>

Saludos,

bauhaus1975 · #3 (**permalink**) 25/04/2005, 11:16

Muchas gracias ! lo he probado y funciona. PERO...

¿Podriamos afinar un poco más? Estoy intentando crearlo cada select en una posición determinada, en una fila nueva de un 'table' por cada nuevo select.
¿Cómo podriamos hacer ésto?

JavierB · #4 (**permalink**) 25/04/2005, 12:22

Hola de nuevo.

¿Te refieres a crear las filas dinamicamente? En esta páginas tienes un ejemplo de como hacerlo. Si tienes problemas para encajar los dos códigos, dilo y veré si puedo echarte un cable.

http://www.tierradenomadas.com/tw006b.html

Saludos,

bauhaus1975 · #5 (**permalink**) 26/04/2005, 10:32

Sí ha eso me refería. Muchas gracias JavierB... PERO...

El ejemplo ha sido de mucha ayuda.
He ido insertando 2 td dentro de un tr, uno de los tds contenia un título simple y el otro el objeto select. Sólo hay dos cosas que no he podido hacer y me echa humo la cabeza:

1) Asignar el class adecuado al TD, sino desentona con el resto de elementos :)
2) Hacer que el tr lo añada al final de la tabla y no al principio

Muchas gracias por la ayuda.
Miguel.

JavierB · #6 (**permalink**) 26/04/2005, 10:54

Hola de nuevo. Veo que vas avanzando

1)

ele=document.createElement('td');
ele.className='tuclase';

2)

En lugar de esto, que supongo que es lo que usas:

elmTBODY.insertBefore(elmTR,elmTBODY.childNodes[3]);

Utiliza esto otro:

elmTBODY.appendChild(elmTR);

Suerte. Saludos,

bauhaus1975 · #7 (**permalink**) 26/04/2005, 11:28

Estupendo, el punto 2 ha funcionado, pero el primero (asignar el class) nada de nada
ni probando con mayusculas, minusculas:

var sel=document.createElement('select');
// Seteo de las propiedades:
sel.ClassName = 'colorform';
sel.setAttribute('id',idHijo);
sel.setAttribute('name',idHijo);

He probado también con el sel.setAttribute('ClassName','colorform');

:((

JavierB · #8 (**permalink**) 26/04/2005, 12:17

Rehola.

No se si habrá sido un error al poner el mensaje, pero debería quedar así (lo había probado antes de poner el anterior mensaje y me ha funcionado)

sel.className = 'colorform';

Saludos,

bauhaus1975 · #9 (**permalink**) 27/04/2005, 01:20

OK, ¡ahora sí!

Muchas gracias y hasta pronto.

JavierB · #10 (**permalink**) 27/04/2005, 02:01

Pues eso, hasta pronto. Me alegro de que te haya funcionado