1
Aprender a programar desde cero / Formularios HTML. Casillas de verificación, Checkbox, Radio. Ejercicio CU00723B.
« en: 27 de Mayo 2016, 11:12 »
Buenas.
Antes de nada quisiera decir que sigo el curso desde el principio pero hasta ahora, gracias a los foros, había resuelto mis dudas viendoa los ejercicios de otros usuarios.
El problema es que en este ejercicio he intentado utilizar la etiqueta label y el atributo id en las checkbox y radio, y no tengo claro si lo he hecho correctamente.
Además, en las listas de opciones no sé si es posible o incluso aconsejable utilizar el atributo id al haber utilizado la etiqueta label de la siguiente manera:
<label>Selecciona todos los grupos que te gustan pulsando la tecla Ctrl</label>
Por último. veo que en algunos ejercicios de otros usuarios se recomienda asignar un value a cada option, aunque en el tema correspondiente del curso dice que no es necesario. ¿Cuál de las dos es la forma más aconsejable?
Aquí os dejo el código para que le echéis un ojo y me digáis qué debo rectificar. Gracias de antemano.
Enunciado del 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 con tres nombres de grupos o cantantes.
Antes de nada quisiera decir que sigo el curso desde el principio pero hasta ahora, gracias a los foros, había resuelto mis dudas viendoa los ejercicios de otros usuarios.
El problema es que en este ejercicio he intentado utilizar la etiqueta label y el atributo id en las checkbox y radio, y no tengo claro si lo he hecho correctamente.
Además, en las listas de opciones no sé si es posible o incluso aconsejable utilizar el atributo id al haber utilizado la etiqueta label de la siguiente manera:
<label>Selecciona todos los grupos que te gustan pulsando la tecla Ctrl</label>
Por último. veo que en algunos ejercicios de otros usuarios se recomienda asignar un value a cada option, aunque en el tema correspondiente del curso dice que no es necesario. ¿Cuál de las dos es la forma más aconsejable?
Aquí os dejo el código para que le echéis un ojo y me digáis qué debo rectificar. Gracias de antemano.
Enunciado del 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 con tres nombres de grupos o cantantes.
Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Ejercicio tema CU00723B sobre opciones de formularios</title>
</head>
<body>
<h1 style="text-align: center; color: blue;">Preferencias musicales</h1>
<br /> <br />
<form action="https://www.aprenderaprogramar.com/action.php" method="get">
<label for="favorita">Tipo de música favorita</label>
<br />
<input type="checkbox" name="pop" id="favorita">Pop
<br />
<input type="checkbox" name="rock" id="favorita">Rock
<br />
<input type="checkbox" name="jazz" id="favorita">Jazz
<br /> <br />
<label for="edaduser">Seleccione su edad</label>
<br />
<input type="radio" name="edad" id="edaduser" value="de12a17">De 12 a 17 años
<br />
<input type="radio" name="edad" id="edaduser" value="de18a35">De 18 a 35 años
<br />
<input type="radio" name="edad" id="edaduser" value="de36a65">De 36 a 65 años
<br />
<input type="radio" name="edad" id="edaduser" value="mayor65">Mayor de 65 años
<br /> <br />
<label>Selecciona todos los grupos que te gustan pulsando la tecla Ctrl</label>
<br />
<select multiple="multiple" name="gruposycantantes[]">
<optgroup label="Pop">
<option value="grupopopa">Grupo Pop A</option>
<option value="grupopopb">Grupo Pop B</option>
<option value="grupopopc">Grupo Pop C</option>
</optgroup>
<optgroup label="Rock">
<option value="gruporocka">Grupo Rock A</option>
<option value="gruporockb">Grupo Rock B</option>
<option value="gruporockc">Grupo Rock C</option>
</optgroup>
<optgroup label="Jazz">
<option value="grupojazza">Grupo Jazz A</option>
<option value="grupojazzb">Grupo Jazz B</option>
<option value="grupojazzc">Grupo Jazz C</option>
</optgroup>
</select>
<br /> <br />
<input type="submit" value="Enviar">
<input type="reset">
</form>
</body>
</html>