Formularios Conjunto de elementos que generan interacción con el usuario para dar u obtener información.

Presentación del tema: "Formularios Conjunto de elementos que generan interacción con el usuario para dar u obtener información."— Transcripción de la presentación:

1

2 Formularios Conjunto de elementos que generan interacción con el usuario para dar u obtener información.

3 <form>

4 Elementos del <form>
<input> Elemento más importante del <form>. Le permite al usuario introducir información. <label> Especifica a qué elemento del formulario está vinculado. <textarea> Delimita un campo de texto. <button> Botón con la posibilidad de distintas funciones.

5 <form> <label>Nombre:</label> <input> <textarea> </textarea> <button>Enviar</button> </form>

6 Atributos para <input>
Name Type Value

7 Especifica el nombre de un elemento <input>.
Name Type Value Especifica el nombre de un elemento <input>.

8 Name Type Value <form>
<input type=“radio” name=“numero-alumno” > Alumno 1 <input type=“radio” name=“numero-alumno” > Alumno 2 <input type=“radio” name=“numero-alumno” > Alumno 3 <input type=“radio” name=“numero-alumno” > Alumno 4 </form>

9 Name Type Value Es usado de forma diferente por distintos “type” de <input>. Ej... type=“text” Muestra un texto por default en el campo. type=“radio”, type=“checkbox” Especifica el valor de cada input.

10 Name Type Value <input type=“text”> <input type=“radio”>
<input type=“checkbox”> <input type=“password”>

11 Atribuye un valor inicial al elemento.
Name Type Value Atribuye un valor inicial al elemento.

12 Name Type Value <form> <p>Nombre</p>
<input type=“radio” name=“numero-alumno” value=“Alum1” > Alumno 1 <input type=“radio” name=“numero-alumno” value=“Alum2” > Alumno 2 <input type=“radio” name=“numero-alumno” value=“Alum3” > Alumno 3 <input type=“radio” name=“numero-alumno” value=“Alum4” > Alumno 4 </form>

13 Otros ejemplos de type type=“number” – Contiene sólo números.
type=“date” – Proporciona un calendario. type=“time” – Proporciona la elección de horario. type=“ ” – Contiene sólo type=“search” – Delimita input de búsqueda. type=“tel” – Especifica que hay un número telefónico. type=“url” – Contiene sólo dirrecciones web (

14 Otros Atributos de inputs
Readonly – Sólo lectura. Disabled – Deshabilitado. Maxlength – Cantidad de caracteres permitidos. Autofocus – Hace foco en el input. Required – Obligatorio. Placeholder – Coloca texto por default.

15 Gracias! 