Como evitar o envio de múltiplas submissões em um formulário HTML com Javascript

Olá amigos.

Hoje irei mostrar uma solução muito simples, mas que em alguns casos pode evitar uma dor
de cabeça no futuro: o envio de múltiplas submissões em um formulário HTML.

O problema acontece quando alguém preenche um formulário HTML e dá duplos cliques no botão "Enviar" causando o envio de duas ou mais submissões.

Estarei trabalhando com jQuery 2.1.3. Vejamos:



Agora adicionaremos a instrução "$("#enviar").prop("disabled", true);" para desabilitar o botão na função do evento onclick. Vejamos agora:



Pronto! Problema solucionado.

Esse bloqueio é feito apenas no lado do navegador. Caso seja necessário bloquear também no lado do servidor é preciso trabalhar com variáveis de sessão conforme a linguagem de programação utilizada. Mas isso é um assunto para outro post.

Dúvidas, sugestões e elogios adicione comentários.
Até mais.

Referências:
Stack Overflow, Javascript - .prop() vs .attr(). Disponível em: <http://stackoverflow.com/questions/5874652/prop-vs-attr> Acesso em 30 de agosto de 2015.

Nenhum comentário:

Postar um comentário