El atributo selected en Javascript
Escrito por J.F. el Tuesday, 28 de August del 2007 a las 12:57
El atributo selected en Javascript sirve para identificar cuando un elemento de un combo ha sido seleccionado. Ésto nos puede resultar tremendamente útil a la hora de realizar diferentes tipos de validaciones en formularios, y asà habilitar o deshabilitar distintos elementos en función de la opción seleccionada en el combo. La forma génerica de identificar un objeto es la siguiente:
document.nombre_formulario.nombre_select[x].selected
Siendo x el número de opción, teniendo en cuenta que se comienza a contar desde 0.
Vamos a ver un sencillo ejemplo, en el cual si se selecciona la opción "Opción deshabilita" quedarán deshabilitados 2 campos de texto, y en caso contrario quedarán habilitadas las cajas de texto. Para ello recurriremos a una función que será llamada en el evento onChange, que comprobará al seleccionar una opción del combo si es "Opción deshabilita", y en caso de serlo dejará deshabilitadas las 2 cajas de texto. En caso contrario estarán habilitadas. Por defecto en el combo hemos dejado una opción en blanco, y en el botón Enviar llamaremos a una función mediante onClick que nos obligará a seleccionar una opción del combo, impidiendo que esté seleccionada la opción en blanco. Aquà tienes todo el código, que después de lo explicado, y teniendo algunas nociones básicas de Javascript no te costará entender:
-
-
function comprobar() {
-
if((document.formulario.menu[1].selected)) {
-
document.formulario.nombre.disabled=true;
-
document.formulario.apellido.disabled=true;
-
}
-
else {
-
document.formulario.nombre.disabled=false;
-
document.formulario.apellido.disabled=false;
-
}
-
}
-
function compruebaCombo() {
-
if((document.formulario.menu[0].selected)) {
-
alert("Debe elegir una opción del combo.");
-
}
-
}
-
</script>
-
</head>
-
-
-
<form name="formulario">
-
<select name="menu" onChange="comprobar();">
-
<option name="num1" value=""></option>
-
<option name="num2" value="1">Opcion deshabilita</option>
-
<option name="num3" value="2">Habilita</option>
-
<option name="num4" value="3">Habilita</option>
-
</select>
-
<label>Nombre:</label>
-
<input type="text" name="nombre">
-
<label>Apellido:</label>
-
<input type="text" name="apellido">
-
<input type="submit" value="Enviar" onClick="compruebaCombo()";>
-
</form>
-
</body>
-
-
</html>
Comentarios (1)
Categoria: Javascript
- Añadir este post a
- Del.icio.us -
- Meneame -
- Digg -
- Webeame
Entradas relacionadas
Comentario de raul
Realizado el Tuesday, 5 de May del 2009 a las 20:56
jeje te repito el coment porque te puse tags y no salieron
no puedes darle un selected pero por el value no por la posicion.. ejem
*FORM name=formulario*
*OPTION value=”10″* posicion 0 */OPTION*
*OPTION value=”20″* posicion 1 */OPTION*
*/FORM*
una forma de darle select pero al value 20 sin decir que es en la posicion 1 si no que algo asi como document.formulario.menu.value[20].selected)
existira algo asi?.. de antemano gracias.
