2

Olá, eu tenho um INSERT, envia, tudo ótimo, mas quando clica várias vezes no botão de submit, envia vários, registros, como posso evitar isso?

Código:

<?php
    $id_noticia  = $edit["id"];
$autor = $_SESSION["username"];
$texto = $_POST["texto"];
$coment = "INSERT INTO `10cms_noticias_resp` ( `id_noticia` , `autor` , `texto`, `data` , `id`, `num` ) VALUES ('$id_noticia', '$autor', '$texto', now(), '', '')";

mysql_query($coment);
?>

Botão:

 <button type="submit" id="comentar" onclick="this.disabled = true;" style="width: 76px;height: 30px;color: white;font-size: 15px;line-height: 20px;border-radius: 50px;border: none;position: absolute;right: 0;background-image: linear-gradient(0deg, #FFA141, #FFB366 100%);margin-right: 10px;">enviar</button>
2
  • Coloque um redirecionador no OK do insert... Ai ele volta pra página de ADD, ou para qual você direcionar. Commented 28/07/2015 às 3:14
  • Olá, já tem redirecionamento, o problema é que demora um tempo para carregar e enviar os registros. Sendo assim se a pessoa clicar várias vezes no botão submit vai enviar vários registros. Commented 28/07/2015 às 3:25

2 Respostas 2

1

A fim de evitar envios múltiplos de um mesmo formulário, segue abaixo recomendações básicas:

1. Desativar a submissão do formulário

Uma vez feito a ação de "submit", desative-o. Exemplo de técnica usando JavaScript:

<script type="text/javascript">
/**
Variável global "form_submited".
*/
window.form_submited = null;

/**
Função que verifica se a variável global possui o id do formulário que está sendo enviado.
*/
function AvoidMultiSubmit(frm)
{

    /**
    Instancia um objeto que receberá mensagens (erro, aviso, etc).
    */
    frm_message = document.getElementById("form_sent_message");

    /**
    Compara o id do formulário atual com a variável global. Se for diferente, proseggue com o envio.
    */
    if( form_submited != frm.id )
    {

        /**
        Atribui o id do form atual a variável global.
        */
        form_submited = form.id;

        /**
        Escreve mensagem de "loading".
        */
        frm_message.innerHTML = "Os dados estão sendo processados, por favor, aguarde.";

        /**
        Permite o envio.
        */
        return true;

    }else{

        /**
        Escreve mensagem de "waiting".
        */
        frm_message.innerHTML ="Por favor, aguarde o processamento dos dados.";

        /**
        Impede o envio.
        */
        return false;

    }
}
</script>

<div id="form_sent_message"></div>
<form id="frm1" onsubmit="return AvoidMultiSubmit(this);">
...
<form>

Por quê não poderia apenas desativar o botão na ação de click (onclick) ?

O motivo é que um formulário pode ser submetido por outros meios que não a ação de click. Por isso, o mais seguro é verificar no evento "OnSubmit".

2. Reforçando a segurança com cookie

Impedir o envio múltiplo de um formulário não é o suficiente pois, num simples "refresh", o usuário ainda terá o formulário "limpo" para enviar novamente. A fim de reforçar a segurança, precisamos implementar uma verificação por cookies. O exemplo abaixo deve ser encaixado dentro da função "AvoidMultiSubmit", na condicional que envia o formulário:

    var name = "cookie_frm1"; // nome do cookie
    var value = "submited"; // um valor qualquer
    var days = 1; // quantidade de dias de expiração

    /**
    Formata os parâmetros
    */
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires=""+date.toGMTString();

    /**
    Cria o cookie
    */
    document.cookie = name+"="+value+expires+"; path=/";

No script PHP que recebe os dados, verifique se o cookie existe:

if( isset( $_COOKIE['cookie_frm1'] ) )
{
    echo 'Ação negada';
    exit;
}

Obs: O bloqueio no PHP pode ser um redirecionamento ou conter outro tipo de mensagem mais amigável ao usuário. O exemplo acima é meramente didático.

Ao completar as execuções no PHP, caso não necessite retornar ao formulário, remova o cookie:

unset( $_COOKIE['cookie_frm1'] )
2
  • Seu código bugou minha cabeça. Eu coloquei ele certinho, mas continua enviando sozinho quando entra na página. Commented 29/07/2015 às 0:29
  • se vc apenas copiou e colou o código acima pensando que fosse funcionar como mágica, aí sim, vc tem problema, que está na sua cabeça. Commented 29/07/2015 às 3:39
0

Adicione um listener em Javascript no botão pra que assim que ele for clicado, ele seja desabilitado - não recebendo mais cliques:

Via script (recomendado):

document.getElementById('idDoBotao').addEventListener('click', function(event) {
    // event.target = quem acionou o evento
    event.target.disabled = true;
});

jQuery

var btn = $('#idDoBotao');
btn.on('click', function(event) {
    btn.disable(true);
});

Direto no botão:

<input type="submit" onclick="this.disabled = true;">
7
  • Funcionou tudo certinho, mas o problema é que quando eu abro a página é como se ele já tivesse apertado sozinho o submit. Commented 28/07/2015 às 3:55
  • Já fica desabilitado na primeira vez que você carrega a página? Ou depois de ter clicado uma vez? Qual das opções você usou? Commented 28/07/2015 às 3:56
  • O que você me passou foi depois de clicar. Só que quando eu carrego a página, automaticamente ele dá submit. Commented 28/07/2015 às 4:00
  • Estranho. Tem como você colocar o código HTML do seu botão na pergunta? Você está usando jQuery? Commented 28/07/2015 às 4:04
  • Não, não estou utilizando jquery. Commented 28/07/2015 às 4:18

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .