quarta-feira, 5 de novembro de 2003

Enviando o Formulário sem o Botão Submit


    Já me perguntaram algumas vezes como enviar um formulário sem utilizar um botão de Submit. As razões são as mais variadas: desde a estética da tela (muitas vezes o botão fica feio mesmo, pricipalmente se o design for arrojado, utilizando imagens e animação em Shockwave Flash) ou mesmo por razões funcionais, como no Internet Explorer, por exemplo, onde o formulário é enviado (sem qualquer pergunta ou confirmação!) quando o usuário tecla ENTER. Como resolver?
    A solução seria fazer o uso de uma função JavaScript, com um link chamando a função:


<script language="JavaScript">
function Enviar(NomeDoForm){

   document.forms[NomeDoForm].submit();
}
</script>


No link, você indica o NomeDoForm, variável que indica o nome do form que você deseja enviar. Desta maneira:


<a href="javascript: Enviar('formAluno')">Enviar</a>


O nome do form pode ser identificado no código HTML do form:


<form name="formAluno" method="post" action="aluno.asp">


Com as facilidades apresentadas pelo JavaScript, poderíamos fazer com que houvesse uma tela de confirmação antes de enviar. Desta maneira, incremetaríamos o código assim:


<script language="JavaScript">
function Enviar(NomeDoForm){

  var conf = false ;
  conf = confirm('Deseja realmente enviar?');
  if (conf){
    document.forms[NomeDoForm].submit();
  }

}
</script>


Note que esse tipo de estratégia que adotamos nos dá a flexibilidade de utilizarmos figuras como botões de Enviar ou até mesmo filmes Shockwave Flash animados que chamam a função JavaScript. Utilizando figuras, teríamos algo como:


<a href="javascript: Enviar('formAluno')"><img src="imagens/enviar.gif"></a>


No Flash, deve ser criado o botão que tenha como Action o seguinte código:


GetUrl("javascript: Enviar('formAluno')");


Obs.: O código utiliza document.forms pois ele é suportado por qualquer Browser, pois a notação NomeDoForm.submit() funciona somente no Internet Explorer. Ainda assim, é vantajoso utilizar document.forms mesmo que no IE, pois podemos contar com a flexibilidade de identificar qual form enviar mais facilmente.

Para saber um pouco mais sobre o envio de formulários via Javascript e suas vantagens leia o artigo Formulário com várias Ações?



Esta matéria foi postada originalmente no ASP4Developers por Adriano Nântua, que na época era "Engenheiro de software e analista de sistemas; Desenvolvedor ASP, Delphi, C/C++ e Java/JSP/Servlets; InterBase fan; Linux fan; Alvirrubro inveterado.". Hoje, vai saber...

1 comentários:

Nathalie .SG. disse...

Muito obrigado! Suas dicas me ajudaram muito... estava com um problema que nao conseguia mandar dois formularios ao mesmo tempo, sendo um de atualização de campos de uma tabela do banco de dados (através de text fields - entrada de usuários) e o outro form era inserção em outra tabela,so atraves de campos hiddenfields.. e eu queria usar o mesmo botao pra isso.. acabei conseguindo fazer com as tuas dicas... no mesmo botao que mandar o form mais interno, coloquei um onblur="javascript: Enviar(form2)" e agora o mesmo botao submit serve para enviar os dois formularios. muito obrigado!