web-dev-qa-db-fra.com

Désactiver l'envoi automatique du formulaire en cliquant sur un bouton

J'ai un formulaire HTML où j'utilise plusieurs boutons. Le problème est que peu importe le bouton sur lequel je clique, le formulaire sera soumis même si le bouton n'est pas de type "submit". par exemple. Des boutons tels que: <button>Click to do something</button> entraînent la soumission du formulaire.

Il est très pénible de faire une e.preventDefault() pour chacun de ces boutons.

J'utilise jQuery et jQuery UI et le site Web est en HTML5.

Existe-t-il un moyen de désactiver ce comportement automatique?

146
Paris

Des boutons comme <button>Click to do something</button>sont des boutons de soumission.

Définissez type="button" pour changer cela. type="submit" est la valeur par défaut (comme spécifié par la recommandation HTML ).

349
Quentin

Ce n'est pas difficile de faire ce que vous voulez. Vous pouvez simplement essayer d’utiliser return false (return false annule le comportement par défaut sur chaque élément DOM) comme ceci:

myform.onsubmit=function()
{ 
  //do what you want;
  return false;
}

puis soumettez votre formulaire en utilisant myform.submit ()

ou bien :

mybutton.onclick=function () 
{
   //do what you want;
   return false;
}

Cependant, je pense que Input type = "button"/Button type = "button" n'enverra pas votre formulaire et vous pourrez les utiliser sans aucun problème.

14
Boris D. Teoharov

Les <button> sont en fait des boutons de soumission, ils n’ont aucune autre fonctionnalité principale. Vous devrez définir le type sur le bouton.
Mais si vous liez votre gestionnaire d’événements comme ci-dessous, vous ciblez tous les boutons et n’avez pas à le faire manuellement pour chaque bouton!

$('form button').on("click",function(e){
    e.preventDefault();
});
7
mas-designs

si vous voulez ajouter directement à entrer en tant qu'attribut, utilisez ceci 

 onclick="return false;" 

<input id = "btnPlay" type="button" onclick="return false;" value="play" /> 

cela évitera le comportement de soumission de formulaire 

0
bh_earth0