Problema com função de validação de campos

[Claudio Neto 3]

Boa tarde.

 

Achei a função abaixo pronta em um site para conferir se campos obrigatórios estão em branco:

function validaCampoObrigatorio(form){
	var erro=0;
	var legenda;
	var obrigatorio;		  
	
	for (i=0;i<form.length;i++){
		obrigatorio = form[i].lang;
		if (obrigatorio==1){
			if (form[i].value == ""){
				var nome = form[i].name;
				mudarCorCampo(form[i], 'gray');
				legenda=document.getElementById(nome);
				legenda.style.color="gray";
				erro++;
			}
		}
	}
	
	if(erro>=1){
		alert("Existe(m) " + erro + " campo(s) obrigatório(s) vazio(s)! ")
		return false;
	}else
		return true;
	
}

function mudarCorCampo(elemento, cor){
	elemento.style.backgroundColor=cor;
}

Ela deve pintar o campo obrigatório que está em branco, apresentar uma mensagem de erro e parar por ai.

 

Ela está pintando o campo de cinza, só que a mensagem não aparece e não aceita o return false, ou seja, é feito o que está no action do form.

 

Alguém sabe me dizer o que está errado nela?

 

Obrigado.

[DSerma 19]

Posta o código do form para q eu possa testar aki....

 

Abraços...

[Otata 4]

posta a parte que você chama a funcção..

[Claudio Neto 3]

Form:

 

<form name="DadosCadastro" method="post" action="check_usuario.asp" style="margin-left:10px" onSubmit="return validaCampoObrigatorio(this)">
					<table name="DadosCadastro" border="0" width="650px" cellspacing="1" cellpadding="4">
					<tr>
						<td colspan="3"><samp id="tipolocal">*Local de entrega: </samp>
						<select name="tipolocal" lang="1"  onFocus="mudarCorCampo(this,'white')">
							<option selected>Residência</option>
							<option>Serviço</option>
							<option>Vizinho</option>
							<option>Outro</option>
						</select>
						</td>
					</tr>
					<tr>
						<td width="350px"><samp id="Endereco">*Endereço: </samp><input  lang="1" type="text" class="CaixaTexto2" size="25" name="Endereco" value="<%=rs("endereco")%>"onFocus="mudarCorCampo(this,'white')"></td>
						<td width="150px"><samp id="numero">*N°: </samp><input  lang="1" type="text" class="CaixaTexto2" name="Numero" size="5" value="<%=rs("numero")%>"onFocus="mudarCorCampo(this,'white')"></td>
						<td width="150px"><samp id="comp">*Comp.: </samp><input  lang="1" type="text" class="CaixaTexto2" name="Comp" size="10" value="<%=rs("complemento")%>"onFocus="mudarCorCampo(this,'white')"></td>
					</tr>
					<tr>
						<td><samp id="bairro">*Bairro: </samp><input type="text"  lang="1" class="CaixaTexto2" name="Bairro" value="<%=rs("bairro")%>"onFocus="mudarCorCampo(this,'white')"></td>
						<td colspan="2"><samp id="cep">*CEP: </samp><input type="text"  lang="1" class="CaixaTexto2" name="CEP" value="<%=rs("cep")%>"onFocus="mudarCorCampo(this,'white')"></td>
					</tr>
					<tr>
						<td><samp id="cidade">*Cidade: </samp><input type="text"  lang="1" class="CaixaTexto2" name="Cidade" value="<%=rs("Cidade")%>"onFocus="mudarCorCampo(this,'white')"></td>
						<td><samp id="estado">*Estado: </samp><input type="text"  lang="1" class="CaixaTexto2" name="Estado" size="5" value="<%=rs("Estado")%>"onFocus="mudarCorCampo(this,'white')"></td>
						<td><samp id="pais">*País: </samp><%Call Cria_Combo_Paises(Session("pais_frete"),"paises")%></td>
					</tr>
					</table>
					<input type="submit" name="ConfirmaCadastro" value="Confirma cadastro">
					<br />
					*Campos obrigatórios
				</form>

[DSerma 19]

Cara.. aki a mensagem apareceu de boa e o return funcionou...

 

Tanto no IE quanto no FF....

 

Ta normal sua função.... o.O

[Claudio Neto 3]

Sério?? Que estranho...

 

Me diga uma coisa. O return false faz a página parar ou carrega novamente a mesma página? Se for a segunda, talvez esteja redirecionando em outra parte do código, mas se é a primeira, não tenho idéia...

[DSerma 19]

O Return false, ou apenas return faz a página parar deste ponto.....

[Claudio Neto 3]

E você não alterou nada na função? Usou exatamente da forma como colei aqui?

[DSerma 19]

Exatamente.... apenas retirei as chamadas em ASP do seu form...

 

Abraços...

[Claudio Neto 3]

Cara, não consegui não achar o que estava fazendo dar errado.

 

Encontrei outra que funcionou:

<script LANGUAGE="JavaScript">
  <!-- from CódigoFonte.net -->
  
  <!-- Begin
  function checkrequired(which) {
  var pass=true;
  if (document.images) {
  for (i=0;i<which.length;i++) {
  var tempobj=which.elements[i];
  if (tempobj.name.substring(0,8)=="required") {
  if (((tempobj.type=="text"||tempobj.type=="textarea")&&
  tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&
  tempobj.selectedIndex==0)) {
  pass=false;
  break;
		   }
		}
	 }
  }
  if (!pass) {
  shortFieldName=tempobj.name.substring(8,30).toUpperCase();
  alert("O seguinte campo "+shortFieldName+" deve ser preenchido.");
  return false;
  }
  else
  return true;
  }
  //  End -->
  </script>
  
  <!-- COLOQUE requer_ ANTES DO NOME DO CAMPO PARA DEFINÍ-LO COMO -->
  <!-- UM CAMPO REQUERIDO -->
  
  <center>
  <form onSubmit="return checkrequired(this)">
 NOME <input type="text" name="requiredNOME"> *
  <br>
 EMAIL <input type="text" name="requiredEMAIL"> *
  <br>
 SENHA <input type="text" name="SENHA">
  <br>
  <select name="OPCAO">
  <option selected>Escolha<option>1
  <option>2
  <option>3
  </select>
  <br><br>
  <input type="submit" value="Enviar">
  </form>

Obrigado pela ajuda.

[klonder 14]

Baseado na dúvida do amigo, resolvi pegar parte do código que ele havia postado e mudei algumas coisas. Ficou da seguinte maneira:

 

O formulário pode ter vários campos, no entanto, apenas os campos que possuírem no nome um "_o" (Ex: texto1_o, ou então email1_o) serão avaliados. Os demais campos não serão validados.

 

Achei muito interessante esse tipo de situação e resolvi fazer algo semelhante. Como eu não pesquisei o que estava errado, resolvi fazer o meu próprio código.

 

Fica aí para quem quiser. Basta testar no editor HTML:

<html>
<head>
<title>Campos obrigatórios</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
/*
Código desenvolvido por: klonder;
Postagem exclusiva em: http://www.forum.imasters.com.br
Liberado para uso e alterações!
*/

//Cor do fundo quando houver erros:
var corFundo = "#FFCCCC";



var iLoop;
function validaForm(fForm){
var erros = 0;
		
	for (iLoop=0; iLoop<document.forms['form1'].length; iLoop++){
		//Verificar se o campo atual é obrigatório;
		//Os campos que recebem "_o" no nome são obrigatórios;
		if(document.forms['form1'].elements[iLoop].getAttribute('name').indexOf("_o") != -1){
			if(document.forms['form1'].elements[iLoop].value == "") {
				mudarCorCampo(iLoop, corFundo);
				erros++;	
			}
		}
	}
	if (erros > 0) {
		alert("Os campos em vermelho são obrigatórios!");
		//alert("Total de erros: "+erros);
		return false;
	}
}

function mudarCorCampo(elemento, hexCor){
	document.forms['form1'].elements[elemento].style.backgroundColor=hexCor;
}
</script>

<form name="form1" method="post" action="pagina.php" onSubmit="return validaForm(this)">
<input type="text" name="campo0" value="">
<br>*<input type="text" name="campo1_o" value="">
<br><input type="text" name="campo2" value="">
<br>*<input type="text" name="campo3_o" value="">
<br><input type="text" name="campo4" value="">

<br><input type="submit" value=" OK ">
</form>
</body>
</html>

Não testei no Firefox. No IE7 está ok!

[William Bruno 1501]

é interessante... eu achei essa outra... bem legal tb...

não precisa se preocupar com o name... mas apenas inserir um TITLE com um * nele.

http://www.prosadigital.com/javascript/val...-em-javascript/