Sweetalert: champ de saisie non fonctionnel lorsqu'il est utilisé au-dessus d'un modal bootstrap

J'ai eu le même problème. Ce que j'ai fini par faire, c'est de «cacher» le modal avec modal.hide, d'ouvrir le swal, de faire tout ce dont vous avez besoin avec inputValue, puis d'afficher le modal avec modal.show en cas de succès ou d'annuler le swal.
J'espère que cela t'aides.

Dan
J'ai trouvé un correctif pour cela. je le posterai demain

Envoyé depuis Outlook

Le lundi 10 août 2015 à 06h52 -0700, "Dan Kaufman" [email protected] a écrit :

J'ai eu le même problème. Ce que j'ai fini par faire, c'est de «cacher» le modal avec modal.hide, d'ouvrir le swal, de faire tout ce dont vous avez besoin avec inputValue, puis d'afficher le modal avec modal.show en cas de succès ou d'annuler le swal.

J'espère que cela t'aides.

-
Répondez directement à cet e-mail ou consultez-le sur GitHub.

Salut mteichtahl,

As-tu toujours posté le correctif ? Je ne le trouve pas. Aiderait vraiment !

Salut,

Même problème avec sweet alert (ainsi que sweetalert2).
Le champ de saisie ne se concentre pas uniquement sur Firefox. Cela se produit uniquement lors de l'ouverture d'un swal à partir d'un modal bootstrap.

Je ne peux pas encore comprendre le problème. Vraiment étrange.

J'ai le même problème... quelqu'un a-t-il une solution ?

salut, cela permet d'afficher l'espace réservé d'entrée, mais n'est pas corrigé pour se concentrer sur l'entrée ...

#537

J'ai le même problème, je ne trouve pas la solution...

+1

J'ai trouvé que le coupable est tabindex="-1" qui est défini sur le modal de Bootstrap.

Le correctif :

// call this before showing SweetAlert:
function fixBootstrapModal() {
  var modalNode = document.querySelector('.modal[tabindex="-1"]');
  if (!modalNode) return;

  modalNode.removeAttribute('tabindex');
  modalNode.classList.add('js-swal-fixed');
}

// call this before hiding SweetAlert (inside done callback):
function restoreBootstrapModal() {
  var modalNode = document.querySelector('.modal.js-swal-fixed');
  if (!modalNode) return;

  modalNode.setAttribute('tabindex', '-1');
  modalNode.classList.remove('js-swal-fixed');
}

J'ai un problème presque identique, sauf qu'il ne se produit que si le modal est si grand qu'il peut défiler sur l'axe des y.

Aidez-moi, s'il vous plaît...

Le correctif de l'onglet de Cinamonas n'a pas fonctionné pour moi :(

+1
@eminumut @navas
Avez-vous appelé fixBootstrapModal() avant d'afficher swal ? J'ai oublié de le faire au début, mais maintenant ça marche parfaitement !

Merci @Cinamonas

@Alagaesia93

Pouvez-vous me montrer des exemples ?

@eminumut

fixBootstrapModal()
swal({whatever}, function(isConfirm){
whatever
restoreBootstrapModal()
}

Ça marche pour moi :)

Le correctif génère une erreur de syntaxe dans IE11

@ caleb87 , j'ai mis à jour l'extrait pour ne pas utiliser les fonctions de flèche et const .

Cela semble être un problème avec Bootstrap, je vais donc fermer pour le moment. Merci pour le correctif @Cinamonas !

Bonjour, j'ai rencontré le même problème.
Ce problème peut être résolu en supprimant { tabindex="-1" } de Bootstrap Modal.
Ça marche bien pour moi.

Quelqu'un sait-il comment appliquer ce correctif dans R ? J'ai le même problème, mais mes tentatives pour le convertir en R ont échoué jusqu'à présent

J'ai trouvé que le coupable est tabindex="-1" qui est défini sur le modal de Bootstrap.

Le correctif :

// call this before showing SweetAlert:
function fixBootstrapModal() {
  var modalNode = document.querySelector('.modal[tabindex="-1"]');
  if (!modalNode) return;

  modalNode.removeAttribute('tabindex');
  modalNode.classList.add('js-swal-fixed');
}

// call this before hiding SweetAlert (inside done callback):
function restoreBootstrapModal() {
  var modalNode = document.querySelector('.modal.js-swal-fixed');
  if (!modalNode) return;

  modalNode.setAttribute('tabindex', '-1');
  modalNode.classList.remove('js-swal-fixed');
}

génie

Pour ceux qui ont plus d'un modal, vous pouvez utiliser :
Documento sem titre (1).pdf