Éviter le rejet modal en appuyant sur la touche Entrée

J'ai configuré un modal bootstrap avec un formulaire à l'intérieur, je viens de remarquer que lorsque j'appuie sur la touche Entrée, le modal est rejeté. Existe-t-il un moyen de ne pas le supprimer lorsque vous appuyez sur Entrée?

J'ai essayé d'activer le modal avec le clavier: false, mais cela n'empêche que le renvoi avec la touche ESC.

J'ai juste eu ce problème aussi.
Mon problème était que j'avais un bouton de fermeture dans mon modal

<button class="close" data-dismiss="modal">&times;</button>

En appuyant sur Entrée dans le champ de saisie, ce bouton a été déclenché. Je l'ai changé pour une ancre à la place et cela fonctionne comme prévu maintenant (enter soumet le formulaire et ne ferme pas le modal).

<a class="close" data-dismiss="modal">&times;</a>

Sans voir votre source, je ne peux pas confirmer que votre cause est la même.

Ajoutez simplement l' attribut type = "button" à l'élément button, certains navigateurs interprètent le type comme étant soumis par défaut.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Attributes

Cela s'applique à tous les boutons que vous avez dans le modal.

<button type="button" class="close" data-dismiss="modal">×</button>

J'ai eu ce problème même après avoir supprimé TOUS les boutons de mon Bootstrap Modal, donc aucune des solutions ici ne m'a aidé.

J'ai trouvé qu'un formulaire avec un seul champ de texte obligerait le navigateur à soumettre un formulaire (et entraînerait le rejet), si vous appuyez sur Entrée alors que le focus du clavier est sur le champ de texte. Cela semble être plus un problème de navigateur / formulaire que n'importe quoi avec Bootstrap.

Ma solution était de définir l'attribut onsubmit du formulaire sur onsubmit = "return false"

Cela peut être un problème si vous utilisez réellement l'événement de soumission, mais j'utilise des frameworks JS qui génèrent des requêtes AJAX plutôt que de faire une soumission de navigateur, donc je préfère désactiver entièrement la soumission. (Cela signifie également que je n'ai pas à modifier manuellement chaque élément de formulaire qui pourrait déclencher une soumission).

Plus d'informations ici: Les boîtes de dialogue modales Bootstrap avec un seul champ de saisie de texte sont toujours fermées sur la touche Entrée

Vous pouvez placer le bouton de connexion avant le bouton d'annulation et cela résoudrait également le problème que vous rencontrez.

<div class="modal-footer">
    <button type="submit" class="btn primary">Login</button>
    <button type="submit" class="btn" data-dismiss="modal">Cancel</button>
</div>

J'ai eu le même problème et je l'ai résolu avec

<form onsubmit="return false;">

mais il y a une autre solution, vous pouvez ajouter une entrée invisible factice, de sorte que votre formulaire ressemblerait à ceci:

<form role="form" method="post" action="submitform.php">
    <input type="text" id="name" name="name" >
    <input type="text" style="display: none;">
</form>

J'ai eu une expérience similaire tout à l'heure et la façon dont je l'ai résolu était au lieu d'utiliser une balise, j'ai changé la balise en une balise avec type = "button". Cela a semblé résoudre le problème d'appuyer sur la touche "Entrée" et de rejeter le modal bootstrap.

J'ai eu ce problème aussi et je l'ai résolu de cette façon. J'ai ajouté onsubmit au formulaire. Je voulais également pouvoir utiliser la clé d'entrée comme clé de sauvegarde, j'ai donc ajouté le javascript save_stuff () à onsubmit. retourner faux; est utilisé pour empêcher l'envoi du formulaire.

<form onsubmit="save_stuff(); return false;">
 ...
</form>

<script>
    function save_stuff(){
      //Saving stuff
    }
</script>