Validar formulário com Javascript

Validação de formulários em Javascript é uma das táticas mais utilizadas atualmente para garantir que os dados requeridos nos campos que o usuário preenche em qualquer website ou blog, sejam realmente fiéis ao que o desenvolvedor deseja. Seja validação após os dados serem enviados ao servidor, com Ajax e PHP, por exemplo, ou a validação em tempo real, ambas envolvem algum tipo de validação em Javascript.

Para obter acesso em qualquer formulário em Javascript, existem algumas maneiras diferentes, todas elas chegando ao mesmo ponto, porém, dependendo de fatores diferentes.

Segue um exemplo de como validar formulário com Javascript com ajuda da nossa biblioteca jQuery.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
	$('#form1').submit(function(){
		var er = new RegExp(/^[A-Za-z0-9_\-\.]+@[A-Za-z0-9_\-\.]{2,}\.[A-Za-z0-9]{2,}(\.[A-Za-z0-9])?/);
		var nome = $('#form_nome').val();
		var email = $('#form_email').val();
 
		if( nome == '' ) { alert('O campo nome não pode ser vazio!'); return false; }
		if( email == '' || !er.test(email) ) { alert('Email inválido!'); return false; }
 
		alert( 'formulário enviado com sucesso!' );
	});
});
</script>
 
<form action="" id="form1">
	<label for="form_nome">Nome</label> <input type="text" id="form_nome" required/> <br/>
	<label for="form_email">Email</label> <input type="email" id="form_email" required/> <br/>
	<input type="submit" value="Enviar"/>
</form>
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on PinterestDigg thisEmail this to someone

Leave a Reply

Your email address will not be published. Required fields are marked *

Translate »