Validar HTML5 desde javascript

Una de las ventajas de HTML es que podemos hacer validaciones desde la misma página para verificar que los textos no estén vacíos, o que un elemento s

Optimizar WordPress para una carga rápida con Autoptimize
Forzar a un sitio para mostrar o no el www
Desarrollo web, servidor local y remoto
Estructura básica de una página en PHP
Usar Google Chrome como apoyo para el desarrollo web

Una de las ventajas de HTML es que podemos hacer validaciones desde la misma página para verificar que los textos no estén vacíos, o que un elemento sea numérico, por ejemplo.

El problema consiste en que esa validación es a través de un formulario de HTML; si queremos utilizar ajax o javascript puro para que nosotros decidamos cuando se haga la validación en el navegador, no se puede; al menos no a primer vista.

Podemos utilizar la manera del siguiente fragmento de código.


<!--
onsubmit="event.preventDefault();
ES PARA EVITAR QUE MANDE EL FORM POR HTML Y CARGUE LA PAGINA DE NUEVO
-->
<form id="elfomulario" name="elfomulario" onsubmit="event.preventDefault();">
Fecha valida <br/>
<input type="date" name="fecha" required="required" />
<br/><br/>
Numero valido y olbigatorio<br/>
<input type="number" required="required" />
<br/> <br/>
Texto obligatorio<br/>
<input type="text" required="required" />
<!--
BUTTON EN LUGAR DE INPUT TYPE=TEXT PARA EJECUTAR EL SUBMIT DEL FORM
-->
<button onClick="valida()">Enviar</button>
</center>
</form>

<script>

function valida(){
//SE EJECUTA LA VALIDACION HTML
if (elfomulario.checkValidity()){
//SI LA VALDIACION ES CORRECTA ENTONCES EJECUTA EL SIGUIENTE CODIGO O PETICION AJAX
alert ("aqui ya se ejecutaria el ajax");
} else {
//HACER ALGO SI LA VALIDACIÓN FALLÓ
}
}
</script>

Cómo podemos ver, el formulario tiene la orden de no enviar la solicitud. En cuanto se de clic al botón enviar, o por cualquier otro medio que nosotros decidamos, ejecutamos una función en javascript, y este ejecutará la verificación de HTML5, si éste es válido, entonces nos permite ejecutar javascript o hacer llamados en ajax como jquery o mootools, por ejemplo. Además, si no pasa la verificación, también nos permite ejecutar algo.

COMMENTS

WORDPRESS: 0