bloquear botão (em HTML) depois de se ter enviado os dados do formulário

peter alien

peter alien

Power Member
Poderiam-me dizer como posso fazer para, quando um utilizador clica no botão de Submit de um formulario, ele não possa voltar a carregar nele logo de seguida?

É que eu reparei que quando se carrega no botão após se ter introduzido os dados no formulário, no periodo em que os dados são processados para a BD, o utilizador pode continuar a carregar no botão quantas vezes quiser. Quando fui abrir a BD tinha carradas de entradas repetidas :(

Existe alguma maneira de evitar que isso aconteça?
 
isso para repetir os registos na bd, é porque não fizeste validações aos campos da bd , se eram ou não obrigatorios preencher etc etc etc.

ja agra qual a linguagem que estas a utilizar para ligar a bd?

ja agora esse botão nunca se põe desactivo, tens é de ter essas validações bemfeitas , para não teres esse tipo de problemas.
 
Vê se isto te ajuda em alguma coisa

Código: 
<html>
<head>
  <script type="text/javascript">
    function ValidateForm(frm){
      var result=true;
      var bt=document.getElementById("btSubmit");
      
      //fazer aqui, por ex. validações de campos ...
      if(!frm.txt.value){
        result=false;
      }
      //
      
      if(result) { //tudo bem preenchido
        bt.disabled=true; //desactivar botão submit
      }
      else{ //erros preenchimento
        alert("Faltam preencher campos ...");
      }

      return result;
    }
  </script>
</head>
<body>
  <form id="frm" name="frm" onsubmit="return ValidateForm(this)">
    Teste <input type="text" id="txt"><br>
    <input type="submit" id="btSubmit" value="Submit">
  </form>
</body>
</html>

Não testei por isso não sei funciona correctamente sem alguns toques :P

Mas basicamente o que faz é quando é activado o submit (onsubmit) do formulário é chamada uma função javascript que desactiva o botão, e poderá também fazer a validação dos campos, verificar se por ex. algum se encontra bem preenchido, fiz isso no exemplo, mas não é de todo obrigatório, já que o fundamental é validar os dados no lado do servidor, já que do cliente basta não ter javascript activo para que não efectue a validação.
Mas pronto tens lá a instrução que te vai permitir desactivar o botão (espero eu :)) depois de feito o submit. Como te disse, não experimentei o código ...

Também convém teres esse cuidado quando inseres os dados, ou arranjares outro mecanismo, porque basta o cliente fazer Refresh à página para estar constantemente a guardar na BD.

Espero ter ajudado.
 
Última edição:
Todos os campos validei-os usando javascript (e são validados em tempo real, usando eventos onkeypressed e onkeydown nas linhas onde defini os controlos HTML), o problema mesmo é que na altura de se clicar no botão, o tempo que leva o servidor a processar os dados, um utilizador poderá sempre continuar a clicar no botão e claro vai mandar novamente os dados para a BD.


Estou a utilizar ASP.NET com acesso a uma BD em Access.

Já agora haverá uma maneira de evitar que o utilizador faça o refresh? Não existe uma instrução que se coloca nos META TAGS que faz com que passado um certo tempo essa página perca a validade e depois seja preciso que ela carregue novamente, ou estou a divagar?
 
Última edição:
Faz assim:

Quando é introduzido um dado na base de dados, REDIRECIONAS para outra página 'os dados foram introduzidos clique aqui para voltar'.
 
Última edição:
Já que utilizas outra forma para validar os dados, podes então simplificar o ex. que já te tinha dado:

Código: 
<html>
<head>
  <script type="text/javascript">
    function PreventMultipleSubmit(){
      document.getElementById("btSubmit").disabled=true;
    }
  </script>
</head>
<body>
  <form id="frm" name="frm" onsubmit="PreventMultipleSubmit();">
    Teste <input type="text" id="txt"><br>
    <input type="submit" id="btSubmit" value="Submit">
  </form>
</body>
</html>

Assim quando é iniciado o submit do form o botão é desactivado.


Em relação ao outro ponto do refresh da página, podes por ex. (após guardares os valores na base de dados e fazeres as operações que tiveres que efectuar) usar o Response.Redirect; ou por ex. verificares se o registo já foi inserido novamente, n sei que valores estás a inserir, mas se por ex. fôr um registo de uma conta, hás-de ter um elemento identificativo do utilizador, seja ele o e-mail, um username, um BI, etc, etc, sempre que fores a inserir um registo terás de verificar se já tens um registo na BD com esse elemento identificador, assim se por ex. fizeres 1 refresh podes verificar se ele já existe ou não; mas devem existir várias maneiras.
 
peter alien disse:
Todos os campos validei-os usando javascript (e são validados em tempo real, usando eventos onkeypressed e onkeydown nas linhas onde defini os controlos HTML), o problema mesmo é que na altura de se clicar no botão, o tempo que leva o servidor a processar os dados, um utilizador poderá sempre continuar a clicar no botão e claro vai mandar novamente os dados para a BD.


Estou a utilizar ASP.NET com acesso a uma BD em Access.

Já agora haverá uma maneira de evitar que o utilizador faça o refresh? Não existe uma instrução que se coloca nos META TAGS que faz com que passado um certo tempo essa página perca a validade e depois seja preciso que ela carregue novamente, ou estou a divagar?
Clicar para expandir...

Em relação ao desactivar o botão e dado que estás a trabalhar com asp podes sempre meter o botao.enabled = false; no método onclick() desse botão.

Para a página perder a validade tens que definir o timeout da sessão (metes a 1 por exemplo) ou provocares tu esse fim de sessão com o Session.Abandon() por exemplo.
 
A parte do evento onclick do botão não funcionou, não sei porquê ?!!!! o código tambem tinha lógica!

Mas finalmente depois de experimentar de várias maneiras a ultima que experimentei que foi usar o "document.getElementById("btSubmit").disabled=true;" finalmente funcionou... já estava a desesperar com aquilo :(

Obrigadão a todos pelas dicas.
 
Não seria melhor fazer esse check aquando do submeter os dados na bd, porque podem sempre alterar isso com javascript injection ou não?
cumpzz
 
Inicie sessão ou registe-se para poder participar.
Back
Topo