PROFESOR: JUAN FRANCISCO ALFONSO ARTEAGA

ALUMNO: Miguel ngel Miron Mondragn

GRUPO: 3TIC4


MATERIA: DESARROLLO DE APLICACIONES WEB

Formularios en HTML5
Los elementos y atributos para formularios en HTML5 proveen un mayor grado de
marcado semntico que en HTML4 y eliminan gran parte del tedioso trabajo de
programacin y diseo que se necesitaba en HTML4. Las funcionalidades de los
formularios en HTML5 brindan una mejor experiencia para los usuarios al permitir
que estos tengan un comportamiento ms coherente entre diferentes sitios web y
proporcionar una retroalimentacin inmediata acerca de la informacin ingresada.
Asimismo, proporcionan esta experiencia a los usuarios que han deshabilitado el
javascript en sus navegadores.
Este documento describe los elementos nuevos o modificados que estn
disponibles en Gecko/Firefox.
El elemento <input> tiene nuevos valores para el atributo type.
search: El atributo representa un campo de bsqueda. Los saltos de lnea son
automticamente eliminados del valor ingresado pero no se modifica ninguna otra
sintaxis.

tel: El atributo representa un control para editar un nmero de telfono. Los saltos
de lnea son automticamente eliminados del valor ingresado pero no se modifica
ninguna otra sintaxis, ya que los nmeros telefnicos varan enormemente en todo
el mundo. Puedes usar atributos como pattern y maxlength para restringir los
valores ingresados en el campo.

url: El atributo representa un control para editar una URL. Se eliminan los saltos de
lnea y espacios en blanco antes y despus del valor ingresado.

email: El atributo representa una direccin de correo electrnico. Los saltos de
lnea se eliminan automticamente del valor ingresado. Puede ingresarse una
direccin de correo no vlida, pero el campo de ingreso slo funcionar si la
direccin satisface la produccin ABNF 1*( atext / "." ) "@" ldh-str 1*( "." ldh-
str ) donde atext est definida en RFC 5322, seccin 3.2.3 y ldh-str est definida
en RFC 1034, seccin 3.5.

Nota: si el atributo multiple est incluido, pueden ingresarse muchas direcciones
de correo electrnico en ese campo <input>, como una lista separada por comas,
pero no est implementado actualmente en Firefox.

El elemento <input> tambin tiene nuevos atributos:
list: el id. de un elemento <datalist> cuyo contenido, los elementos <option>, van a
ser usados como ayudas y sern mostrados como propuestas en el rea de
sugerencias del campo input.

pattern: una expresin regular respecto a la cual se comprueba el valor del control,
que puede ser usada con valores de type de text,tel, search, url y email.

formmethod: una cadena que indica qu mtodo HTTP (GET, POST, PUT o
DELETE) debe ser usado cuando se enva; sobrescribe el methoddel
elemento <form>, si se define. El formmethod slo se aplica cuando
el type es image o submit.

x-moz-errormessage : una cadena que se muestra como un mensaje de error si el
campo no logra validarse. Es una extensin de Mozilla.

El elemento <form> tiene un nuevo atributo:
novalidate: este atributo evita que el formulario sea validado antes del envo.
El elemento <datalist> El elemento <datalist> representa la lista de
elementos <option> como sugerencias cuando se llena un campo <input>. Puedes
usar el atributo list en un elemento <input> para enlazar a un campo de ingreso
especfico con un elemento <datalist>determinado.

El elemento <output> representa el resultado de un clculo.
Puedes usar el atributo for para especificar una relacin entre el elemento output y
otros elementos en el documento que afectan el clculo (por ejemplo, ingreso de
datos o parmetros). El valor del atributo for es una lista separada por espacios de
identificadores de otros elementos.

El atributo placeholder en elementos <input> y <textarea> proporciona una
ayuda a los usuarios acerca de qu debe ingresarse en el campo. El texto
introducido en el placeholder no debe contener retornos de carro o saltos de lnea.

El atributo autofocus te permite especificar que una parte del formulario debe
tener foco para ingresar informacin cuando se carga la pgina, a menos que el
usuario lo cambie, por ejemplo al escribir en otro lugar. Slo un elemento del
formulario en un documento puede tener el atributo autofocus, que es booleano.

Este atributo puede ser aplicado a los
elementos <input>, <button>, <select> y <textarea>.

La excepcin es que autofocus no puede aplicarse a un elemento <input> si el
atributo type hidden est seleccionado (es decir, no puede enfocar
automticamente un elemento escondido).
La propiedad label.control del DOM
La interface HTMLLabelElement DOM brinda una propiedad extra, sumadas a las
propiedades que corresponden a los atributos del elemento<label> de HTML. La
propiedad control devuelve el controlador etiquetado, es decir, el controlador para
el que est hecha la etiqueta, que est determinado por el atributo for (si est
definido) o por el primer elemento controlador descendiente.
Validacin restringida
El HTML5 brinda sintaxis y elementos de API para posibilitar la validacin de
formularios del lado del cliente. Aunque esta funcionalidad no reemplaza la
validacin del lado del servidor, que todava es necesaria por seguridad e
integridad de la informacin, la validacin del lado del cliente puede brindar una
experiencia de usuario mejor al darle al usuario una respuesta inmediata acerca
de la informacin ingresada.
Si se ajusta el atributo title al elemento <input>, esa cadena se mostrar en una
ventana emergente de ayuda cuando falle la validacin. Sititle se ajusta a una
cadena vaca, no se mostrar ninguna ventana emergente. Si el atributo title no se
configura, en su lugar se mostrar el mensaje de validacin estndar (como
especifica el atributo x-moz-errormessage o llamando al
mtodo setCustomValidity()).

Nota: la validacin restringida no es compatible con los elementos <button> en un
formulario; si quieres aplicar estilo a un botn basado en la validez del formulario
asociado, usa la seudoclase :-moz-submit-invalid.
Sintaxis de HTML para la validacin restringida
Los siguientes elementos de sintaxis de HTML5 pueden ser usados para restringir
datos en el formulario.

El atributo required en los elementos <input>, <select> y <textarea> indica que se
debe ingresar algn dato. (En el elemento <input>,required solo se aplica con
ciertos valores del atributo type.)
El atributo pattern en el elemento <input> restringe el valor para que concuerde
con una expresin regular especfica.

Los atributos min y max del elemento <input> restringen los valores mximos y
mnimos que pueden ser ingresados.

El atributo step del elemento <input> (cuando se usa en combinacin con los
atributos min y max) restringe la granularidad de los valores ingresados. Un valor
que no se corresponda con un valor permitido no ser validado.

El atributo maxlength de los elementos <input> y <textarea> restringe el mximo
nmero de caracteres (en puntos de cdigo unicode) que el usuario puede
ingresar.

Los valores url y email para type restringen el valor para una URL o direccin de
correo vlida respectivamente.

Adems, puedes evitar la validacin restringida especificando el
atributo novalidate en el elemento <form>, o el atributo formnovalidate en el
elemento <button> y en el elemento <input> (cuando type es submit o image).
Estos atributos indican que el formulario no ser validado cuando se envie.
API de validacin restringida
Las siguientes propiedades y mtodos del DOM relacionadas con la validacin
restringida estn disponibles para scripts del lado del cliente:
En objetos HTMLFormElement el mtodo checkValidity(), que devuelve
verdadero si todos los elementos asociados del formulario que necesitan
validacin satisfacen las restricciones, y falso si no lo hacen,
En elementos asociados al formulario:
La propiedad willValidate, que es falso si el elemento no satisface las
restricciones.
La propiedad validity, que es un objeto ValidityState que representa los estados
de validacin en que est el elemento (p. ej., condiciones de restriccin que
han fallado o exitosas).

La propiedad validationMessage, que es un mensaje que contiene todas las
fallas o errores en las restricciones que pertenecen a ese elemento.
El mtodo checkValidity(), que devuelve falso si el elemento no logra satisfacer
alguna de las restricciones, o verdadero si pasa lo contrario.
el mtodo setCustomValidity(), que establece un mensaje de validacin
personalizado, permitiendo imponer y validad restricciones ms all de las que
estn predefinidas.