Consulta de código implementado en javascript con un error
Tengo un tremeeendo problema con un código que estoy escribiendo...
(Esto recién aprendiendo y no logro ver porqué no me resulta...)
La idea es que tengo una página con tres radiobutton... A cada uno le asigono un valor para enviárselo a la función...
En la página, más abajo, tengo un select múltiple al que debo hacer que dependiendo del radiobutton que pinche, se seleccionen varios de sus items...
¿Se entiende la idea?
Acá va el código de la página:
<html>
<!-- Creation date: 07-05-2004 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
//largo se usa nombre.length
//determinar valor con nombre.options.value
//se selecciona con nombre.options.selected=true
var l=seleccion.length-1;
function sel(t);
{
for (var p=0;p<=l;p++);
{
if(seleccion.options
.value==t)
seleccion.options
.selected=true;
else
seleccion.options
.selected=false;
}
}
</script>
<title>Test 1</title>
</head>
<body bgcolor="ivory">
<table border="0" align="center" summary="" width="70%">
<tr>
<td>Categoría:<BR>
<input type="radio" name="radio1" onclick="sel(1);"> Vegetal<BR>
<input type="radio" name="radio1" onclick="sel(2);"> Animal<BR>
<input type="radio" name="radio1" onclick="sel(3);"> Insecto<BR></td>
<td></td>
</tr>
<tr>
<td><select size="7" name="seleccion" multiple>
<option value="1">Rosas</option>
<option value="2">Perro</option>
<option value="2">Gato</option>
<option value="3">Matapiojo</option>
<option value="2">Leon</option>
<option value="3">Caballo</option>
<option value="1">Clavel</option></td>
<td></td>
</tr>
</table>
</body>
</html>
No me funciona y no sé porqué... Si me puedes ayudar.. Estaré eteeernamente agradecido!
2 Respuestas
De todas maneras te mando el código corrigiendo esos fallitos (pero no te acostumbres).
<html><!-- Creation date: 07-05-2004 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="Javascript">
//largo se usa nombre.length
//determinar valor con nombre.options.value
//se selecciona con nombre.options.selected=true
function sel(t) {
for (var p=0;p<=document.form1.seleccion.length;p++) {
if(document.form1.seleccion.options
.value==t) {
document.form1.seleccion.options
.selected=true;
}else {
document.form1.seleccion.options
.selected=false;
}
}
}
</script><title>Test 1</title></head>
<body bgcolor="ivory">
<form id="form1" name="form1">
<table border="0" align="center" summary="" width="70%">
<tr>
<td>Categoría:
<input type="radio" name="radio1" onclick="sel(1);"> Vegetal
<input type="radio" name="radio1" onclick="sel(2);"> Animal
<input type="radio" name="radio1" onclick="sel(3);"> Insecto
</td>
<td></td>
</tr>
<tr>
<td>
<select size="7" name="seleccion" multiple>
<option value="1">Rosas</option>
<option value="2">Perro</option>
<option value="2">Gato</option>
<option value="3">Matapiojo</option>
<option value="2">Leon</option>
<option value="2">Caballo</option>
<option value="1">Clavel</option>
</select>
</td>
<td></td>
</tr>
</table>
</form>
</body>
</html>
for (var p=0;p<=l;p++);
function sel(t);
Osea que a esos hay que quitarles los puntos y comas. Por otra parte y para que funcione en los navegadores a parte de seguir el estándar es mejor declarar 'seleccion', haciendo referencia al elemento así:
var seleccion=document.getElementsByName("seleccion");
Y por ultimo, aunque este todo bien puesto, no funcionara, porque a un select no le puedes seleccionar ni deseleccionar nada (o nunca lo he visto). Lo puedes hacer con checkboxes. Con estos funciona de la misma manera que has puesto, con la propiedad checked en vez de selected en true tendrán un tick de marca, en caso contrario no.