Select e Input

SileBird · #1 (**permalink**) 05/05/2009, 05:22

Muy buenas,

Nunca he dado en mi vida JavaScript, pero me mandan usarlo. Mi problema seria sencillo si fuera en Visual Basic pero estoy obligado a realizar JavaScript.

Estoy en una página JSP,l tengo una Select con varias opciones, una de ellas es "Otro". Cuando se selecciona "Otro" en esta select, debe aparecer un Input al lado para poder escribir en el.

Bien, en Visual sería que el Input no estuviera visible hasta que el objeto selecionado de la Select fuera "Otro". Pero en JavaScript ni idea como será.

Gracias por adelantado.

quimfv · #2 (**permalink**) 05/05/2009, 05:47

Código HTML:

<!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 miraselect(obj){
if (obj.value=="otro"){
 document.getElementById("iii").style.display="block";
 }else{
 document.getElementById("iii").style.display="none";
 }
}
</script>
</head>
<body>
<select name="ii" id="ii" onChange="miraselect(this)">
  <option value="valor1">valor1</option>
  <option value="otro">otro</option>
</select><br>
<input name="iii" type="text" id="iii" style="display:none">
</body>
</html>

si?

Como puedes ver no hay nada nuevo bajo el sol....!!!

Quim

SileBird · #3 (**permalink**) 05/05/2009, 06:05

WoOoW

Me esperaba que me lo esplicaran no que me lo dieran de frente XD, muchisimas gracias, aunque no me funciona, eso si, desaparecer está desaparecido el Input, vease:

·Script:

Código:

<script language="JavaScript" type="text/JavaScript">
	function miraselect(obj){
		if (obj.value=="Otros"){
 			document.getElementById("Otro").style.display="block";
 		}else{
	 		document.getElementById("Otro").style.display="none";
 		}
	}
</script>

·Donde he de usarlo:

Código:

<td height="50px" width="175px">
	 <select name="Tipo" onChange="miraselect(this)">
  		<option>Comercial</option>
  		<option>Productos</option>
  		<option>Envio y Transporte</option>
  		<option>Cuenta Premium</option>
  		<option>Otros</option>
      	  </select>
</td>
<td height="50px" width="75px">
	 <input type="text" name="Otro" style="display:none"/>
</td>

Editado: Eso sí, tampoco provoca error alguno.

quimfv · #4 (**permalink**) 05/05/2009, 06:39

Código HTML:

<!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 miraselect(obj){
if (obj.value=="Otros"){
 document.getElementById("Otro").style.display="block";
 }else{
 document.getElementById("Otro").style.display="none";
 }
}
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="175px" height="50px" valign="middle">
<select name="Tipo" id="Tipo" onChange="miraselect(this)">
  		<option value="Comercial">Comercial</option>
  		<option value="Productos">Productos</option>
  		<option value="Envio y Transporte">Envio y Transporte</option>
  		<option value="Cuenta Premium">Cuenta Premium</option>
  		<option value="Otros">Otros</option>
      	  </select></td>
    <td width="175px" height="50px" valign="middle">
<input name="Otro" type="text" id="Otro" style="display:none"></td>
  </tr>
</table>
</body>
</html>

Fijate en la diferencias....

(getElementById luego los elements tienen que tener id!!!)

Quim

SileBird · #5 (**permalink**) 05/05/2009, 06:43

Vaya cacho zorolo que soy.

Muchas gracias jefe !!!

Aun no me puedo creer que me olvide de los "Id" y de los "Value"