Função JavaScript não funciona

jhoey · Junho 13, 2009

Ae galera, belza?

Estou com um probleminha aqui, se vcs puderem me ajudar, eu agradeço.

Estou tentando fazer um "editor de texto" bem simples, só pra quebrar um galho, só que qndo clica no botão para enviar, executa primeiro uma função javascript e dependendo do que retornar ele ativa o action. Só que se o código javascript estiver na pagina ele roda normal, mas eu separei o código javascript em um arquivo diferente, pra ficar mais bunito a codificação e organizado o projetinho, ae que aparece o problema, o código não é executado, ele vai direto para o action. Alguem sabe me explicar pq? até coloquei um alert('oi'); pra ver se ele estava entrando na função, mas nem o alert aparece.

Segue o codigo:

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Postador de Noticias </title>

<script language="JavaScript" src="funcoes.js"></script>

</head>
<body>

<h1 align="center">Postador de Noticias</h1>
<div align="center">
<form id="frmPostador" name="Postador" method="POST" action="validar.php" onSubmit="return validaForm()">
<table>
  <tr>
	<td>  Seção: </td>
	<td align="left"><select name="secao">
	  <option value="0"></option>
	  <option value="1">Pagina Inicial</option>
		</select> </td>
  </tr>
  <tr></tr>
  <tr>	
	  <td>Titulo: </td>
	  <td align="left"><input name="txtTitulo" type="text" size="50" maxlength="50"/></td>
  </tr>
  <tr>
	<td>Mensagem:  </td>
	  <td align="left"><textarea name="txtMensagem" cols="50"></textarea> </td>
  </tr>
  <tr>
	  <td></td>
	<td align="left"><input type="button" name="btNegrito" value="Negrito" onclick="addNegrito(this)" />
		<input type="button" name="btItalico" value="Italico" onclick="addTag('i')" />
  <tr>
	  <td>Matéria: </td>
	<td align="left">
	  <textarea name="txtMateria" rows="15" cols="50"></textarea></td>
   </tr>
</table>
<input type="submit" name="btEnviar" value="Enviar"/>
<input type="reset" name="btLimpar" value="Limpar"/>
</form>
</div>
<p>

</body>
</html>

funcoes.js

function validaForm()
	{
		//alert('oi');
		//Valida titulo
		if(f.txtTitulo.value == ""){
			alert('O Campo Titulo deve ser preenchido');
			f.txtTitulo.focus();
			return false;
		}
		
		//Valida Mensagem
		if(f.txtMensagem.value == ""){
			alert('O Campo Mensagem deve ser preenchido');
			f.txtMensagem.focus();
			return false;
		}
		return false;
	}

PS.: Fórum muito bom.. 1º MSG hehehe

augustoclaro · Junho 13, 2009

1 - Verifique se está sendo chamado tudo corretamente.

2 - Mude a função para:

function validaForm(f)
	{
		//alert('oi');
		//Valida titulo
		if(f.txtTitulo.value == ""){
			alert('O Campo Titulo deve ser preenchido');
			f.txtTitulo.focus();
			return false;
		}
		
		//Valida Mensagem
		if(f.txtMensagem.value == ""){
			alert('O Campo Mensagem deve ser preenchido');
			f.txtMensagem.focus();
			return false;
		}
		return false;
	}

3 - mude o onsubmit para:

onSubmit="return validaForm(this)"

Bom, é isso.

Espero ter ajudado!

jhoey · Junho 13, 2009

Então...

<script language="javascript" src="/funcoes.js"></script>
<script language="javascript">
alert('oi');
</script>

Todos os arquivos estão no mesmo diretório

Mas ele não "inclui" o arquivo funcoes.js

O alert('oi') abaixo ele funciona normal, mas o alert('oi') que esta no funcoes.js ele não executa, eu sei q ta como comentario, mas mesmo assim não executa.

<script language="javascript">
alert('oi');
</script>

Alguem mais pode me ajudar?

Pita · Junho 13, 2009

Pode estar no mesmo diretório, mas a função validaForm não sabe que o f é o formulario, aí você tem 2 opções,

ou faz como augusto disse e chama a função passando o this como paramentro

ou dentro da função, a primeira coisa que você faz é:

f=document.getElementById("frmPostador");

Assim você iria atribuir o formulario ao f para trabalhar dentro da funcao, mas não vai esquecer de mudar o ultimo return para true

jhoey · Junho 13, 2009

Mas o estranho é que ele não executa nada que esteja no arquivo separado, tem funções, que eu chamo sem passar parametros e mesmo assim ele nao funciona...

Alguma luz?

iRCC · Junho 15, 2009

olhando todas as respostas eu acho que seu código está certo.

porém.... eu usaria assim:

<script type="text/javascript" src="SeuCaminho"></script>

mude isto e veja se funciona.

tbm passe o this como parametro como o Augusto falou.

Pita · Junho 15, 2009

faz um teste,

coloca um alert('oi') fora da função, na hora que ele carregar o arquivo tem que aparecer o alert

webmind · Junho 15, 2009

jhoey vamo ver se entende

você esta dizendo que se o elemento txttitulo que esta em f(que supostamente seria o form) estiver vazio retorna false, mas o que acontece é que f nao existe logo nao e executado e como dá erro a funcao deixa de funfar

por isso tem de definir o formulario que pode fazer desta maneira

f=document.getElementById("frmPostador")

function validaForm()
	{
	f=document.getElementById("frmPostador")
		//Valida titulo
		if(f.txtTitulo.value == ""){
			alert('O Campo Titulo deve ser preenchido');
			f.txtTitulo.focus();
			return false;
		}
		
		//Valida Mensagem
		if(f.txtMensagem.value == ""){
			alert('O Campo Mensagem deve ser preenchido');
			f.txtMensagem.focus();
			return false;
		}
		return false;
	}

para incluir o js você tem de colocar o caminho correto, ex se estiver no mesmo diretorio da pagina será

<script type="text/javascript" src="funcoes.js"></script>

se estiver noutra pasta

<script type="text/javascript" src="caminho/funcoes.js"></script>

jhoey · Junho 16, 2009

faz um teste,

coloca um alert('oi') fora da função, na hora que ele carregar o arquivo tem que aparecer o alert

Intom, num aparece não.

Eu ja usei a linha <script type="text/javascript" src="arquivo.js"></script> em outros projetos e funcionou...

Apesar q eu fazia em asp.net e usava o visual studio 2008, mas agora to usando o dreamweaver, e vendo se eu uso o aptana, pra desenvolver em php.

Mas ainda não consegui a solução.

Abrass

webmind · Junho 16, 2009

leu bem os posts?

leia bem pk se funciona nos nosso browsers com as dicas que foram aqui ditas tb funciona no seu.

atente no js que eu passei no exemplo, e tambem a pita falou do nome do formulario e você ainda esta dizendo que nao funfa?

Pita · Junho 16, 2009

Vamos lá

Os arquivos estão na mesma pasta?

Se não estiver tem que colocar o caminho(normalmente o relativo)

O nome do arquivo na chamada é exatamente igual ao nome do arquivo?

Não sei se é o caso, mas sistemas como Linux são casesensitives

A chamada da função e a função tem exatamente o mesmo nome?

O Javascript é casesensitive

Ted k' · Junho 16, 2009

se está usando o onsubmit a melhor forma é trocar isso:

f=document.getElementById("frmPostador")

por isso:

var f = document.frmPostador;

e o false errado no final, coloca assim

function validaForm()
	{
	var f = document.frmPostador;
		//Valida titulo
		if(f.txtTitulo.value == ""){
			alert('O Campo Titulo deve ser preenchido');
			f.txtTitulo.focus();
			return false;
		}
		
		//Valida Mensagem
		if(f.txtMensagem.value == ""){
			alert('O Campo Mensagem deve ser preenchido');
			f.txtMensagem.focus();
			return false;
		}
		return true;
	}

Arquivado

Função JavaScript não funciona

Recommended Posts

jhoey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

augustoclaro 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

jhoey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Pita 53

Compartilhar este post

Link para o post

Compartilhar em outros sites

jhoey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

iRCC 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Pita 53

Compartilhar este post

Link para o post

Compartilhar em outros sites

webmind 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

jhoey 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

webmind 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Pita 53

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ted k' 126

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante