Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

alexandremanowar

[Resolvido] Validar formulário

Por , em Javascript

Recommended Posts

alexandremanowar    0

alexandremanowar
Postado

E a e pessoal beleza!

 

Eu fiz uma validação de form que ficou legal, é a seguinte:

 

função js que valida:

//validar string do campo caso esteja vazio
function campos_vazios(x)
{
  for(var i=0; i<x.length; i++)
  {
	var string = x.charAt(i);
	
	if((string!="\n") && (string!=''))
	{
	  return false;
	}

	return true;
  }
}

function validacao(f)
{
  var msg;
  var name_fields = "";

  for(var i=0; i<f.length; i++)
  {
  
  var field = f.elements[i];
	  
	if(((field.type == "text") || (field.type == "textarea") || (field.type == "password")) && !field.optional)
	{
	  if((field.value == null) || (field.value == "") || (campos_vazios(field.value)))
	  {
		name_fields += "\n" + field.name;
		continue;
	  }
	  if((field.name == "nome") && ((field.value.length < 4) || (!field.value.match(/ /))) )
	  {
		name_fields += "\n" + field.name;
		continue;
	  }
	  if((field.name == "email") && ((field.value.indexOf('@') < 0) || (field.value.indexOf('.') < 0)))
	  {
		name_fields += "\n" + field.name; 
	  }
	 
	}
  }

  if(!name_fields)
  {
	return true;
  }

 	msg =  "_______________________________________________________\n\n";
	  msg += "Os seguintes campos não foram preenchidos corretamente:\n";
	  msg += "_______________________________________________________\n\n";

	if(name_fields)
	  {
			msg += name_fields + "\n";

			alert(msg);
			return false;
	  }
}

E vai dessa forma no form:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>Generic WebDisk</title>
  <style type="text/css">
	@import url(stylesheets/layout.css);
	@import url(stylesheets/text.css);
  </style>

  <script type="text/javascript" language="javascript" src="js/validador.js"></script>
</head>

<h1><center>cadastro de funcionários</center></h1>

<form method="post" action="#" onsubmit="this.complemento.optional = true;this.ctps.optional = true; return validacao(this);" >
nome: <input type="text" name="nome" id="nome"/><br />
rg: <input type="text" name="rg" id="rg"/><br />
cpf: <input type="text" name="cpf" id="cpf"/><br />
ctps: <input type="text" name="ctps" id="ctps" /><br />
fone: <input type="text" name="fone" id="fone"/><br />
email: <input type="text" name="email" id="email"/><br />
endereço: <input type="text" name="endereco" id="endereco"/><br />
complemento: <input type="text" name="complemento" id="complemento"/><br />
bairro: <input type="text" name="bairro" id="bairro"/> <br />
cidade: <input type="text" name="cidade" id="cidade"/><br />
uf: <input type="text" name="uf" id="uf"/><br />
sexo: <input type="radio" name="sexo" value="masculino" checked />masculino <input type="radio" name="sexo" value="feminino" /><br />
cargo: <input type="text" name="cargo" id="cargo"/><br />
salário: <input type="text" name="salario" id="salario"/><br />
<input type="submit" value="Enviar" id="enviar" />

</form>
</body>
</html>

A função funciona legal o único problema é o seguinte os campos que podem passar de qualquer forma entraram na linha:

<form method="post" action="#" onsubmit="this.complemento.optional = true;this.ctps.optional = true; return validacao(this);" >

 

lá eles estão como optional, assim podem passar sem entrar na validação ou seja enviar em branco ou com qualquer tipo de valor, porém vou ter que fazer um form que vai ter uns 60 campos optinal, sendo assim vai ficar muito grande essa linha pra colocar na tag do form! Será que não tem como eu defenir esse optional direto dentro da tag de cada campo?

 

Valeu

Compartilhar este post

Link para o post
Compartilhar em outros sites

andreia_sp    1

andreia_sp
Postado
hmmm bom uma sugestao que é a que me vem em mente agora seria colocar ids para o grupo obrigatorio, oq nao tiver essa id será opcional e logo nao precisará entrar no loop.

Compartilhar este post

Link para o post
Compartilhar em outros sites

DSerma    19

DSerma
Postado

Além doque a andreia disse, voce pode fazer o seguinte...

 

Dentro de cada campo que é "obrigatorio", crie um novo parametro, chamado "obrigatorio" ( lol ! )... e faça a verificação apenas destes campos....

 

Tipo:

 

<input name = "nome" id = "nome" obrigatorio = "sim">

Ai basta criar uma função JS que faça a varredura do seu form, verificando se o atributo "obrigatorio" é = a "sim"... se for, ele faz a validação, caso contrário, passa batido...

 

para fazer a validação.. faça tipo assim:

 

function Verifica()
{

var campos = document.getElementsByTagByTagName("input");

for (i=0;i<campos.length;i++)
{
if (campos[i].getAttribute("obrigatorio") == "sim")
{
if (campos[i].value == "")
{
alert('Atenção! O campo ' + campos[i].getAttribute("name") + ' deve ser preenchido!');
campos[i].focus();
}
}
}
}

É só uma sugestão.. eu faria assim...

 

Abraços...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito