Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: Jack_F en 02 de Diciembre 2016, 23:10
-
Aquí esta el ejercicio CU00720B del tutorial de programación web para principiantes.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Ejemplo del uso de formularios - aprenderaprogramar.com</title>
</head>
<body>
<h1>Inscripción al congreso de Medicina Santiago 2048</h1>
<!--Médicos especialistas-->
<h2>Congreso para médicos especialistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label>
<input type="text" name="nombre" id="nombre">
<label for="apellido">Apellido: </label>
<input type="text" name="apellido" id="apellido">
<br/><br/>
<label for="especialidad">Especialidad: </label>
<input type="text" name="especialidad" id="especialidad">
<br/><br/>
<label for="onio_esp">Año de obtención de especialidad: </label>
<input type="text" name="onio_esp" id="onio_es">
<br/><br/>
<input type="submit" value="Eviar">
<input type="reset" value="Borrar">
</form>
<br/>
<hr style="height:8px; color: red;background-color: red;" />
<!-- Médicos generalistas-->
<h2>Inscripción al congreso para médicos generalistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label>
<input type="text" name="nombre_gen" id="nombre_gen">
<label for="apellido">Apellido: </label>
<input type="text" name="apellido_arg" id="apellido_arg">
<br/><br/>
<label for="centro_med_med">Centro de médico donde ejerce: </label>
<input type="text" name="centro_med" id="centro_med">
<label for="onio_gen">Año de obtención de título: </label>
<input type="text" name="onio_gen" id="onio_gen">
<br/><br/>
<input type="submit" value="Enviar">
<input type="reset" value="Borrar">
</form>
</body>
</html>
-
Hola, en el ejercicio esta todo bien excepto en tu uso con las etiquetas <label> en los formularios:
<h2>Congreso para médicos especialistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label>
<input type="text" name="nombre" id="nombre">
<label for="apellido">Apellido: </label>
<input type="text" name="apellido" id="apellido">
<br/><br/>
<label for="especialidad">Especialidad: </label>
<input type="text" name="especialidad" id="especialidad">
<br/><br/>
<label for="onio_esp">Año de obtención de especialidad: </label>
<input type="text" name="onio_esp" id="onio_es">
<br/><br/>
<input type="submit" value="Eviar">
<input type="reset" value="Borrar">
</form>En el campo "Año de obtención de especialidad:" dice que esta destinado a "onio_esp" en vez de ser "onio_es" que es lo que indica la id que colocaste.
<h2>Inscripción al congreso para médicos generalistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label>
<input type="text" name="nombre_gen" id="nombre_gen">
<label for="apellido">Apellido: </label>
<input type="text" name="apellido_arg" id="apellido_arg">
<br/><br/>
<label for="centro_med_med">Centro de médico donde ejerce: </label>
<input type="text" name="centro_med" id="centro_med">
<label for="onio_gen">Año de obtención de título: </label>
<input type="text" name="onio_gen" id="onio_gen">
<br/><br/>
<input type="submit" value="Enviar">
<input type="reset" value="Borrar">
</form>En el primero indicas <label for="nombre">, es decir, esta destinado a un campo cuya id es "nombre" en lugar de colocar nombre_gen.
Lo mismo pasa en el segundo que en vez de ser for="apellido_arg" dice solo "apellido"
Y en el tercero que en ves de ser for="centro_med" colocaste "centro_med_med"
CONCLUSION
Recuerda que label usa el atributo for para indicar que esta destinado a un campo o control a través de su id, ejemplo: si le vas a incluir un label a un input debes hacerlo de la siguiente manera:
<label for="marca">Marca del auto: </label><input type="checkbox" name="marcaDeAuto" id="marca">
Como ves en el codigo, Input es un campo con id="marca" y label lleva como atributo for="marca".
Puedes comprobar mejor esto al clickear sobre el label, notaras que al hacerlo se activara el control, cuando un label lleva un atributo for diferente a la id de un input, este efecto no sucederá.
-
Hay meti la pata. Y gracias, Chompy129 por la ayuda. Pero puedo poner un, checkbox , combox o radio en <input type=. Entonces sería algo así.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Ejemplo del uso de formularios - aprenderaprogramar.com</title>
</head>
<body>
<h1 style="text-aling:center; font-size; color:blue;">Inscripción al congreso de Medicina Santiago 2048</h1>
<!--Médicos especialistas-->
<h2>Congreso para médicos especialistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label><input type="text" name="nombre" id="nombre">
<label for="apellido">Apellido: </label><input type="text" name="apellido" id="apellido">
<br/><br/>
<label for="especialidad">Especialidad: </label><input type="text" name="especialidad" id="especialidad">
<label for="onio_esp">Año de obtención de especialidad: </label><input type="text" name="onio_esp" id="onio_esp">
<br/><br/>
<input type="submit" value="Eviar">
<input type="reset" value="Borrar">
</form>
<br/>
<hr style="height:8px; color: red;background-color: red;" />
<!-- Médicos generalistas-->
<h2>Inscripción al congreso para médicos generalistas</h2>
<form action="https://www.aprenderaprogramar.com" method="get">
<label for="nombre">Nombre: </label><input type="text" name="nombre_" id="nombre">
<label for="apellido">Apellido: </label><input type="text" name="apellido" id="apellido">
<br/><br/>
<label for="centro_med">Centro de médico donde ejerce: </label><input type="text" name="centro_med" id="centro_med">
<label for="onio_gen">Año de obtención de título: </label><input type="text" name="onio_gen" id="onio_gen">
<br/><br/>
<input type="submit" value="Enviar">
<input type="reset" value="Borrar">
</form>
</body>
</html>Corregí los errores que me señalaste ahora creo que esta bién. Gracias por la ayuda.
-
Hola Jorgito Pucheta. :)
<input type= puede contener varios valores para definir su función, entre estos estan "text", "checkbox", "radio", etc (no existe combobox, en lugar de eso se utiliza una etiqueta). Esto lo entenderás mejor a lo largo del curso, aunque tambien podrias investigar en internet.
En cuanto al nuevo código que dejaste, debes tener en cuenta que id y name deben tener valores únicos, es decir, en ambos formularios no se pueden repetir. Como consecuencia, al buscar a una etiqueta por su id, HTML toma al primero que encuentra y no al que tratas de usar.
Sin embargo, todo lo demás es correcto, te envio un saludo. ;D
-
Gracias, Chompy129 por la explicación del uso de el atributo: name y id. Ahora entendí un poquito mejor.
Saludos. :D