Foros del Web - Ver Mensaje Individual - Ocultar un select y mostrar otro al pusar radio

quimfv · #3 (**permalink**) 21/06/2011, 06:53

Código HTML:

Ver original<table width="44%" border="1">
 
<tr>
<td width="40%" class="parrafo"><div align="left"><strong>Posee SubNivel:</strong></div></td>
<td width="60%" class="parrafo">&nbsp;&nbsp;Si
<input type="radio" name="radio" id="radio" value="radio" onClick="link1.style.display='';link2.style.display='none'">
&nbsp;&nbsp;No
<input type="radio" name="radio" id="radio2" value="radio" onClick="link1.style.display='none';link2.style.display=''"></td>
</tr>
<tr id="link1" style="display:none">
<td class="parrafo">Select si, Sí&nbsp;</td>
<td class="parrafo"><select name="select1" id="select1">
<option>dato11</option>
<option>datos11</option>
</select>
</td>
</tr>
<tr id="link2" style="display:none">
<td class="parrafo">Select si, No&nbsp;</td>
<td class="parrafo"><select name="select2" id="select2">
<option>dato12</option>
<option>datos12</option>
</select>
</td>
</tr>
 
</table>

Fàcil no?... ojo que el select sigue existiendo y el formulario lo mandará... pero eso ya te ocurria antes....

Lo suyo seria que te asegures que el select oculto tenga el valor nulo....

Código HTML:

Ver original<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento sin t&iacute;tulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
function cambiaSelect(numIdSelect){
if(numIdSelect=="1"){
numIdOtroSelect="2";
}else{
numIdOtroSelect="1";
}
document.getElementById("link"+numIdSelect).style.display='';
document.getElementById("link"+numIdOtroSelect).style.display='none';
document.getElementById("select"+numIdOtroSelect).selectedIndex=0;
}
</script>
</head>
<body>
<table width="44%" border="1">
 
<tr>
<td width="40%" class="parrafo"><div align="left"><strong>Posee SubNivel:</strong></div></td>
<td width="60%" class="parrafo">&nbsp;&nbsp;Si
<input type="radio" name="radio" id="radio" value="radio" onClick="cambiaSelect('1')">
&nbsp;&nbsp;No
<input type="radio" name="radio" id="radio2" value="radio" onClick="cambiaSelect('2')"></td>
</tr>
<tr id="link1" style="display:none">
<td class="parrafo">Select si, Sí&nbsp;</td>
<td class="parrafo"><select name="select1" id="select1">
<option value="0">...</option>
<option value="1">dato11</option>
<option value="2">datos11</option>
</select>
</td>
</tr>
<tr id="link2" style="display:none">
<td class="parrafo">Select si, No&nbsp;</td>
<td class="parrafo"><select name="select2" id="select2">
<option value="0">...</option>
<option value="1">dato12</option>
<option value="2">datos12</option>
</select>
</td>
</tr>
 
</table>
</body>
</html>

Cuydado lo contrario de

.style.display='none';

no es

.style.display='block';

si no

.style.display='';

aún que lo parezca...

Otra cosa

.selectedIndex=0;

será el valor nulo porque considero que este, el valor nulo, es la opción que he puesto en primer lugar

<option value="0">...</option>

que su value="0" no tiene nada que ver con el selectedIndex=0