désactiver correctement le bouton soumettre

Question

c'est le code que j'utilise pour désactiver le bouton

  $("#btnSubmit").attr('disabled', 'disabled') 
      $("#btnSubmit").disabled = true; 

et ceci est mon bouton Envoyer

<input id="btnSubmit" class="grayButtonBlueText" type="submit" value="Submit" /> 

le bouton bien apparence désactivé, vous pouvez toujours cliquer sur Cela est testé avec FF 3.0 et IE6

Est-ce que je fais quelque chose de mal ici?

Answer 1

En fonction de la manière dont la soumission de formulaire est gérée, vous devrez peut-être également supprimer tous les gestionnaires de clic et/ou en ajouter un qui annule la soumission.

$('#btnSubmit').unbind('click').click(function() { return false; }); 

Vous devrez ajouter à nouveau le gestionnaire de clic lorsque (si) vous réactivez le bouton.

Answer 2

Si c'est une forme réelle, à savoir événement pas javascript traité, cela devrait fonctionner.

Si vous manipulez le bouton avec un événement onClick, vous le trouverez probablement encore déclenché. Si vous faites cela, vous feriez mieux de simplement définir une variable dans votre JS comme buttonDisabled et de vérifier cette variable lorsque vous gérez l'événement onClick.

Sinon, essayez

$(yourButton).attr("disabled", "true"); 

Et si après tout cela, vous obtenez encore nulle part, vous pouvez manuellement « casser » le bouton en utilisant jquery (cela devient sérieux maintenant):

$(submitButton).click(function(ev) { 
    ev.stopPropagation(); 
    ev.preventDefault(); 
}); 

Cela devrait arrêter le bouton agissant comme un bouton.

Answer 3

Vous devez traiter le bouton Précédent/Précédent dans le navigateur. exemple ci-dessous

1) Créer Form.js:

(function($) { 
    $.enhanceFormsBehaviour = function() { 
     $('form').enhanceBehaviour(); 
    } 

    $.fn.enhanceBehaviour = function() { 
     return this.each(function() { 
      var submits = $(this).find(':submit'); 
      submits.click(function() { 
       var hidden = document.createElement('input'); 
       hidden.type = 'hidden'; 
       hidden.name = this.name; 
       hidden.value = this.value; 
       this.parentNode.insertBefore(hidden, this) 
      }); 
      $(this).submit(function() { 
       submits.attr("disabled", "disabled"); 
      });   
      $(window).unload(function() { 
       submits.removeAttr("disabled"); 
      }) 
     }); 
    } 
})(jQuery); 

2) Ajouter à votre HTML:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#contact_frm).enhanceBehaviour(); 
    }); 
</script> 

<form id="contact_frm" method="post" action="/contact"> 
    <input type="submit" value="Send" name="doSend" /> 
</form> 

:) Terminé