Ir para conteúdo

POWERED BY:

Arquivado

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

Khrys

[JavaScript] Checa e valida campo

Por , em Javascript

Recommended Posts

Khrys    0

Khrys
Postado

Bom dia pessoal,

 

Gostaria de uma ajuda de vocês, se possível. Estou criando um formulário simples com 3 input do tipo texto. Preciso criar uma validação do tipo:

 

Se o campo X não estiver vazio, ele precisa conter ao menos 3 caracteres

 

Onde o X é o campo1, campo2 e campo3.

 

Comecei a criar algo assim:

 

<script language="javascript">

function ValidaFormulario()
{

var MinimoDeCaracteres= 3;

if ((document.Formulario.displayName.value.length != 0) || (document.Formulario.displayName.value.length != null))

	if ((document.Formulario.displayName.value.length < MinimoDeCaracteres))
	{
		alert('O campo1 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
		return false;
	}

	else
	{
		return true;
	}

if ((document.Formulario.department.value.length!=0) || (document.Formulario.department.value.length!=null))

	if ((document.Formulario.department.value.length < MinimoDeCaracteres))
	{
		alert('O campo2 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
		return false;
	}

	else
	{
		return true;
	}

if ((document.Formulario.sAMAccountName.value.length!=0) || (document.Formulario.sAMAccountName.value.length!=null))

	if ((document.Formulario.sAMAccountName.value.length < MinimoDeCaracteres))
	{
		alert('O campo3 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
		return false;
	}

	else
	{
		return true;
	}


}
</script>

 

Os campos não são dependentes mas se existir algum caracter, tem que ter ao menos 3. Do jeito que está, o script está exigindo que os 3 campos tenha pelo menos 3 caracteres para enviar o formulário. Se eu usar somente o primeio bloco de código (o displayName) ele funciona, ou seja, ele checa e valida. A questão é quando a checagem precisa acontecer nos outros 2 campos.

 

Obrigado por qualquer ajuda.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ted k'    126

Ted k'
Postado

Só esta bagunçado teu código, arrumei aqui para você:

 

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript">
function ValidaFormulario(){
var MinimoDeCaracteres = 3;

var formu		= document.Formulario;
var display_name 	= formu.displayName;
var department 		= formu.department;
var sAMAccountName 	= formu.sAMAccountName;
var mensagem		= "Preencha o campo";

// Campo 01
if (display_name.value == ""){
	alert(mensagem);
	display_name.focus();
	return false;
}
if (display_name.value.length < MinimoDeCaracteres){
	alert('O Campo 01 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
       	return false;
}

// Campo 02
if (department.value == ""){
	alert(mensagem);
	department.focus();
	return false;
}
if (department.value.length < MinimoDeCaracteres){
	alert('O Campo 02 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
       	return false;
}

// Campo 03
if (sAMAccountName.value == ""){
	alert(mensagem);
	department.focus();
	return false;
}
if (sAMAccountName.value.length < MinimoDeCaracteres){
	alert('O Campo 03 deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
       	return false;
}

}
</script>
</script>
<title>HTML5</title>
</head>
<body>
<form method="post" name="Formulario" onSubmit="return ValidaFormulario();">
Campo 01: <input type="text" name="displayName" /><br />
Campo 02: <input type="text" name="department" /><br />
Campo 03: <input type="text" name="sAMAccountName" /><br />
<button type="submit">Enviar</button>
</form>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Khrys    0

Khrys
Postado

Só esta bagunçado teu código, arrumei aqui para você:

 

Obrigado Ted pelo ajuste no tópico e pela ajuda no código. Eu fiz um pequeno ajuste em cima do código que você me passou (que ajudou 100%, valeu mesmo!). Ficando:

 

function ValidaFormulario(){
       var MinimoDeCaracteres = 3;

       var errors = "";
       var formu               = document.Formulario;
       var display_name        = formu.displayName;
       var department          = formu.department;
       var sAMAccountName      = formu.sAMAccountName;
       var mensagem            = "Preencha o campo";

       // Campo 01
       if (display_name.value != "")
       {
	if (display_name.value.length < MinimoDeCaracteres)
	{
               	alert('O campo Nome deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
               	return false;
        }
       }

       // Campo 02
       if (department.value != "")
       {
	if (department.value.length < MinimoDeCaracteres)
	{
               	alert('O campo Área deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
               	return false;
        }
       }

       // Campo 03
       if (sAMAccountName.value != "")
       {
	if (sAMAccountName.value.length < MinimoDeCaracteres)
	{
               	alert('O campo Chave de rede deve conter ao menos ' + MinimoDeCaracteres + ' caracteres.');
               	return false;
        }
       } 
}
</script>

 

Contudo, tentei de algumas formas impedir que o formulário fosse submetido sem que pelo menos um dos 3 campos estivesem sido preenchidos. Se somente um dos 3 for preenchido pode submeter.

 

Tentei assim:

 

if ((display_name.value == '') || (department.value == '') || (sAMAccountName.value == ''))
{
	alert('preencha pelo menos um campo');
	return false;
   	}

 

E assim:

 

if ((display_name.value == '' || display_name.value == null) || (department.value == '' || department.value == null) || (sAMAccountName.value == '' || sAMAccountName.value == null))
{
	alert('preencha pelo menos um campo');
	return false;
}

 

Mas não funcionou como eu estava imaginando que funcionaria. Será que é sintaxe? Obrigado novamente.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ted k'    126

Ted k'
Postado

não é bom fazer tudo junto e sim um de cada vez, melhor até para fazer edição, caso contrário, atrapalha muito

Compartilhar este post

Link para o post
Compartilhar em outros sites

Khrys    0

Khrys
Postado

não é bom fazer tudo junto e sim um de cada vez, melhor até para fazer edição, caso contrário, atrapalha muito

 

Não entendi quando você diz para não fazer tudo junto. O lance é que se eu fizer assim, funciona para um campo:

 

if (document.Formulario.department.value == '')
   {
alert('mensagem');
return false;
   }

 

Mas assim não funciona para 2:

 

if ((document.Formulario.department.value == '') || (document.Formulario.displayName.value == ''))
   {
alert('mensagem');
return false;
   }

 

PS: Não consigo retirar o '[Resolvido]' do tópico...

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ted k'    126

Ted k'
Postado

Falo essa linha:

if ((display_name.value == '' || display_name.value == null) || (department.value == '' || department.value == null) || (sAMAccountName.value == '' || sAMAccountName.value == null))

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