(Resolvido) Evento on click não chama função

[Proteu]

Boa tarde pessoal,

to com uma duvida banal aki...

Gostaria de chamar uma função depois de clicar no botão OK...porém não stou conseguindo....

segue o código para análise....

<script language="JavaScript">
     function valida_dados(nmcurso){
           if (nomeform.nmcurso.value==""){
             alert("Favor Preencher o campo Curso.");
             document.form1.nmcurso.focus();
              return false;
            }
           if (!confirm("Você deseja mesmo cadastrar esta cidade?")) {
                 return false
              }
       }
                     </script>
.
.
.
<form name="form1" method="post" action="curso2.php">
.
.
.
<input type="submit" name="submit" value="cadastrar" onClick="valida_dados(this)">
<input type="submit2" name="submit" value="limpar"
.
.
.

Desculpe pela ignorância, mas sou iniciante em JS

Editado Agosto 28, 2009 por Proteu

[Jonathan Queiroz]

Ocorre algum erro ?

De qualquer forma, recomendo que corrija algumas coisas em seu código.

Por exemplo, ao invés do atributo language da tag script, prefira utilizar o type

<script type="text/javascript">

Sempre prefira também escrever o nome de atributos em minúsculo Ao invés de:

<input type="submit" name="submit" value="cadastrar" onClick="valida_dados(this)">

Utilize:

<input type="submit" name="submit" value="cadastrar" onclick="valida_dados(this)">

Também falou um ">" no seu código, mas imagino que tenha sido algum problema na hora de copiar o código

<input type="submit2" name="submit" value="limpar">

[Danilo Moraes]

Segue parte do seu code:

function valida_dados(nmcurso){
           if (nomeform.nmcurso.value==""){
             alert("Favor Preencher o campo Curso.");
             document.form1.nmcurso.focus();
              return false;
            }
           if (!confirm("Você deseja mesmo cadastrar esta cidade?")) {
                 return false
              }
       }

Aqui tens que pensar assim, se o campo nmcurso for vazio, eu mostro o alert, SENAO eu pergunto se ele quer confirmar. então acabou faltando um ELSE ali. Outra:

<input type="submit" name="submit" value="cadastrar" onClick="valida_dados(this)">

Nessa linha você esta chamando a funcao, enviando como parametro uma referencia ao proprio objeto de botao submit. não precisas fazer isso já que quando se dispara uma funcao, um objeto event já é criado... E da mesma forma, porque estarias comparando se o valor do botao esta vazio? O certo seria enviar no minimo a referencia ao objeto de texto. Tem outro probleminha que não descobri como resolver: não sei porque, mas se o return false estiver dentro da funcao que o botao submit chama, o formulario é submetido assim mesmo. então segue o codigo para solucionar o seu problema.

<script language="JavaScript">
     function valida_dados(){
           if (form1.campo.value==""){//campo e o nome do input text...
             alert("Favor Preencher o campo Curso.");
             document.form1.campo.focus();
            }else{//aki o else que falei
               if (confirm("Você deseja mesmo cadastrar esta cidade?")) {
            document.form1.submit();//ao invés de dar return false, eu envio o formulario se o usuario apertou ok
        }
       }
     }
                     </script>

<form name="form1" method="post" action="curso2.php">

<input type="text" name="campo">
<input type="submit" name="submit" value="cadastrar" onClick="valida_dados(); return false"><!--aki deveria ficar o return false, que iria cancelar o submit de todo o click, sendo que ai so tens que mandar submeter com a funcao submit()-->
</form>

[Proteu]

Bom dia companheiros,

Jonathan--> não era exibido nenhum erro, a função só não era chamada...vou fazer uma pesquisa pra saber as vantagem de usar o que você disse e vou corrigir os demais códigos onde utulizei a mesma sintaxe...

vlw pelas dicas.... :)

Danilo--> deu certinho...agora chama a função. E pra mim está tudo ok (o botão cancelar apenas fecha o confirm box)

<script language="JavaScript">
     function valida_dados(){
           if (form1.campo.value==""){//campo e o nome do input text...
             alert("Favor Preencher o campo Curso.");     
            document.form1.campo.focus(); 
                                                return false; 
           }else{//aki o else que falei
              if (confirm("Você deseja mesmo cadastrar esta cidade?")) {
            return false;
        }
       }
     }
 </script>

Não preciso de document.form1.submit(); pois tenho uma função fora deste JS que já faz o submit....

VlW GALERA! OBRIGADO PELA ATENÇÃO...

Editado Agosto 28, 2009 por Proteu

[Proteu]

Vou chamar padre Quevedo pra ver meu sistema....

Quando respodi havia dado tudo certo e agora não aastr mais no banco....

a adição da document.form1.submit(); (que eu disse não precisar anteriormente) resolve o problema... retirei também "!" que estava antes do confirm...

Segue corrigido

<script language="JavaScript">
     function valida_dados(){
           if (form1.nmcurso.value==""){
             alert("Favor Preencher o campo Curso.");
             document.form1.nmcurso.focus();
              return false;
            }
           
            if(confirm("Você deseja mesmo cadastrar esta cidade?")){
            document.form1.submit();
            }  
       }
                     </script>

Editado Agosto 28, 2009 por Proteu

[Danilo Moraes]

Foi como mostrei no meu codigo anterior, sem o ! e com o submit(). Isso acontece porque tiramos o efeito de submit do botao quando no atributo onclick colocamos return false. então teriamos que literalmente simular um submit pelo javascript.

Olha, quando mostrei o codigo anterior, apenas corrigi o que estava errado e sai super atrasado para a escola. Agora com um pouco mais de tempo, vou deichar algumas palavras com vocês asudhasudhuashduash.

segue...

Tem outro probleminha que não descobri como resolver: não sei porque, mas se o return false estiver dentro da funcao que o botao submit chama, o formulario é submetido assim mesmo.

Um pequeno momento de distracao minha, e isso acontece ^^ Vamos seguir a seguinte logica: Percebemos que conseguimos suprimir o efeito do botao submit quando estamos com a expressao return false no proprio evento onclick. Segue o codigo de como esta o html ate então:

<input type="submit" name="submit" value="cadastrar" onClick="valida_dados(); return false">

então, se nos tirarmos esse return false, quando o javascript executar a funcao, o html ficaria mais ou menos assim:

<input type="submit" name="submit" value="cadastrar" onClick="false">

Perceberam que para eu suprimir o efeito, eu tenho que estar com a expressao return ali, certo? então agora ficou bem simples, para não ter que usar o submit na funcao, so fazer return valida_dados(). Segue o novo codigo:

<script language="JavaScript">
     function valida_dados(){
           if (form1.campo.value==""){//campo e o nome do input text...
             alert("Favor Preencher o campo Curso.");
             document.form1.campo.focus();
         return false;
            }else{
               if (!confirm("Você deseja mesmo cadastrar esta cidade?")) {
        return false;
        }
       }
     }
                     </script>

<form name="form1" method="post" action="curso2.php">

<input type="text" name="campo">
<input type="submit" name="submit" value="cadastrar" onClick="return valida_dados()"><!--aki deveria ficar o return false, que iria cancelar o submit de todo o click, sendo que ai so tens que mandar submeter com a funcao submit()-->
</form>

Bom, so um adicional referente as normas da W3C. A W3C é uma organizacao criada com o intuito de padronizar a web. Seguir os seus padroes, é fundamental para se ter sistemas bem estruturados e de facil manutensao. O nosso colega Jonathan Queiroz frisou um pouco disso, e vou mostrar mais algumas coisas para mudar:

<script language="JavaScript">

Esse atributo language e considerado deprecated ou seja "fora de uso" ou ultrapassado e é extremamente aconselhavel utilizar a seguinte expressao:

<script type="text/javascript">

Repare que tudo esta com letras minusculas, para que sigamos as normas de documentos XHTML. Depois, a W3C determina que o atributo name é deprecated tmb, e que deve-se usar o atributo id para referenciar elementos. Porem, quando você submete um formulario, os elementos serao enviados com os nomes que estao no atributo name, sendo assim, você pode colocar os dois atributos se precisar. Exemplo:

<input type="text" name="campo" id="campo">

Repare nessa outra parte, que eu não coloquei o atributo name para o formulario e nem para o botao submit:

<form id="form1" method="post" action="curso2.php">
<input type="submit" id="submit" value="cadastrar" onClick="return valida_dados()">

não coloquei porque não vou precisar enviar esses dados para o servidor, então tanto faz o nome que eles vao ter no servidor. Em sistemas desenvolvidos com ajax, foi literalmente abolido o uso do atributo name já que você tera que setar todo o conteudo da requisicao por post ou por get, então você pode simplesmente pegar dos atributos id. Agora que já sabemos que temos que referenciar os elementos pelo seu id, como faremos isso? Simples: document.getElementById("elemento"); Segue abaixo o seu codigo reformulado para as normas da W3C:

<script type="text/JavaScript">

     function valida_dados(){
    var campo = document.getElementById("campo");
           if (campo.value==""){
             alert("Favor Preencher o campo Curso.");
             campo.focus();
         return false;
            }else{
               if (!confirm("Você deseja mesmo cadastrar esta cidade?")) {
             return false;
        }
       }
     }
</script>

<form id="form1" onsubmit="return valida_dados()" method="post" action="curso2.php">

<input type="text" name="campo" id="campo">
<input type="submit" id="submit" value="cadastrar">
</form>

Nele, so tem uma coisa que eu ainda não espliquei, que é o evento onsubmit. Esse evento é acionado quando o formulario é submetido e é muito melhor você usar esse evento do que o evento onclick do botao submit. Por que? Eu já tive que fazer em um sistema, varios botoes submeterem o mesmo formulario, so que com algumas diferencas entre eles. Se eu setace a funcao de validar o formulario no onclick, teria que fazer todos esses botoes com o atributo onclick, já dessa forma seto apenas 1 vez.

Como sempre escrevi mais um texto =/

Espero ter esclarecido suas duvidas. Qualquer coisa, posta ai.

T+