Autor Tema: checkbox y radio en form HTML. select, option y optgroup. multiple. CU00723B  (Leído 2154 veces)

LuisM

  • Intermedio
  • ***
  • APR2.COM
  • Mensajes: 131
    • Ver Perfil
Hola a todos !! Paso a dejar el código en HTML del ejercicio propuesto CU00723B del curso básico de programación HTML. Desde ya muchas gracias. Saludos,
Luis

EJERCICIO
Crea una página web que contenga un formulario que cumpla estas condiciones. Como título principal de la página debe figurar con etiquetas h1 el texto “Preferencias musicales”. Debe contener tres checkbox que permitan elegir tipos de música favoritas entre Rock, Pop y Jazz. Seguidamente mediante radio buttons se debe pedir la edad ofreciendo estas opciones: de 12 a 17 años, de 18 a 35 años, de 36 a 65 años y más de 65. Finalmente, se deben poder elegir “grupos y cantantes que te gustan” permitiéndose la selección múltiple y ofreciendo un optgroup denominado Rock con tres nombres de grupos o cantantes, otro optgroup denominado Pop con tres nombres de grupos o cantantes y otro optgroup denominado Jazz con tres nombres de grupos o cantantes.

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Preferencias musicales</title>
</head>
<body>
<form method="get" action="http://aprenderaprogramar.com/action.php">
<h1>PREFERENCIAS MUSICALES</h1>
 Selecciona tu música preferida:
 <br />
<input name="cbirock" type="checkbox" />Rock
<br />
<input name="cbipop" type="checkbox" />Pop
<br />
<input name="cbijazz" type="checkbox" />Jazz
<br /><br /><br />
 Selecciona tu rango de edad:
 <br />
<input name="edad" type="radio" value="rbi12a17" />De 12 a 17 años
<br />
<input name="edad" type="radio" value="rbi18a35" />De 18 a 35 años
<br />
<input name="edad" type="radio" value="rbi36a65" />De 36 a 65 años
<br />
<input name="edad" type="radio" value="rbimas65" />Más 65 años
<br /><br /><br />
 Elije tantas opciones como quieras, como con casillas de verificación (manteniendo presionada la tecla "Ctrl"):
 <br />
<select name="entradalista[]" multiple="multiple">
<optgroup label="Cantantes de Rock">
<option>Cantante de Rock 1</option>
<option>Cantante de Rock 2</option>
<option>Cantante de Rock 3</option>
</optgroup>
<optgroup label="Cantantes Pop">
<option>Cantante Pop 1</option>
<option>Cantante Pop 2</option>
<option>Cantante Pop 3</option>
</optgroup>
<optgroup label="Cantantes de Jazz">
<option>Cantante de Jazz 1</option>
<option>Cantante de Jazz 2</option>
<option>Cantante de Jazz 3</option>
</optgroup>
</select>
<br/> <br/>
<input type="submit" value="Enviar" />
</form>
</body>
</html>
« Última modificación: 01 de Enero 2018, 20:16 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Buenas LuisM, todo bien.

Recomendamos escribir <meta charset="utf-8"/> en lugar de <meta charset="utf-8"> para cumplir el estándar XHTML.

Otra recomendación sería no usar caracteres que no sean letras o números en los atributos, por ejemplo name="entradalista" mejor que name="entradalista[]"

Salu2

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".