Bueno, pensé en los Label, pero igual complicaba demasiado la marrana, pero he visto que es más correcto.
Y lo del formulario...
Cita:
Iniciado por mape367 Pero más bien no lo ha puesto para simplificar el ejemplo, si quieres un formulario, pues pon un formulario.
Cierto,
if you put water in a teapot, it becomes the teapot, así que ya está metido en un formulario, y con su action="alert(..)" para que
caricatos se vea satisfecho
(No he encontrado otra manera que sacar los valores con una funcion, no se me ha ocurrido nada más).
Basta sustituir un par de cosas.
Código PHP:
<form id="formulario" action="javascript: alert( loSeleccionado() );">
<select id="elSelect">
<option value="1">Casa</option>
<option value="2">Coche</option>
<option value="3">Cartera</option>
<option value="4">Llave</option>
<option value="5">Bombilla</option>
<option value="6">Interruptor</option>
</select>
<input type="button" value="cambia" onclick="cambiar()" />
<input type="submit" value="mandar" />
</form>
<script>
var elForm=document.getElementById("formulario");
var esSelect=true;
function cambiar() {
if(esSelect) {
var elSelect=document.getElementById("elSelect");
var opciones=elSelect.options;
var padre=document.createElement("P");
padre.id="padre";
for(var a=0; a<opciones.length; a++) { //un radio por cada opcion
try{
var radio=document.createElement('<input type="radio" name="deSelect" value="'+opciones[a].value+'" />');
} catch(err) {
var radio=document.createElement("INPUT");
radio.type="radio";
radio.name="deSelect";
radio.value=opciones[a].value;
}
if(elSelect.options.selectedIndex==a)
var iSeleccionado=a;
padre.appendChild(radio);
var label=document.createElement("LABEL");
label.appendChild( document.createTextNode(opciones[a].text) );
padre.appendChild( label );
padre.appendChild( document.createElement("BR") );
}
elForm.replaceChild(padre, elSelect);
padre.childNodes[iSeleccionado*3].checked=true; //marcar el seleccionado (despues de replaceChild, si no en IE no funciona
}
else {
var padre=document.getElementById("padre");
var hijos=padre.childNodes;
var elSelect=document.createElement("SELECT");
elSelect.id="elSelect";
for(var a=0; a<hijos.length; a++) { //recorremos los hijos
if( hijos[a].tagName=="INPUT" && hijos[a].type=="radio" ) { //que solo sean radios
elSelect.options[ elSelect.options.length ]=new Option( hijos[a].nextSibling.childNodes[0].data, hijos[a].value );
if( hijos[a].checked ) //marcar el seleccionado
elSelect.options[ elSelect.options.length-1 ].selected=true;
}
}
elForm.replaceChild(elSelect, padre);
}
esSelect=!esSelect;
}
function loSeleccionado() {
if(esSelect) {
var elSelectOp=document.getElementById("elSelect").options;
return elSelectOp[elSelectOp.selectedIndex].value+" --> "+elSelectOp[elSelectOp.selectedIndex].text;
}
else {
for(var a=0; document.forms[0].deSelect[a].checked==false ; a++) //cual esta checkeado?
if( document.forms[0].deSelect[a].checked )
break;
return document.forms[0].deSelect[a].value+" --> "+document.forms[0].deSelect[a].nextSibling.childNodes[0].data;
}
}
</script>
Bueno, pues más o menos está. Si se os ocurren más mejoras plasmarlas aquí mismo.
Por cierto Opera no lo tengo instalado en este ordenador, solo tengo IE y FF, así que no se cómo irá. Pero me juego algo a que no funciona porque cuando lo tube todo eran dolores de cabeza..
El ejemplo simple del principio se me está engordando un poquillo..
Un saludo a los dos!
PD: No se me ocurre cómo transformar un textarea en un select (o un text en un select). ¿Con cada valor separado por comas o algo así? Eso lo veo un poco más rebuscado que esto del select>>radio. Aunque tampoco le encuentro utilidad verdadera al select>>radio, la verdad.