[JAVA] Si cela ne change pas avec l'option disable

Lors de la création d'un formulaire avec Rails, vous pouvez empêcher la double soumission en ajoutant l'option disable_with au bouton d'envoi.

= f.button 'Envoyer', data: { disable_with: 'Envoi en cours…' }

Cependant, uniquement dans Safari, le libellé du bouton n'a pas changé pour une raison quelconque. Il existe de nombreux rapports sur GitHub. disable_with doesn't work with link in Safari #306

Solution

Pour écrire à partir de la conclusion, j'ai pu éviter la précipitation en retardant délibérément le processus de transmission avec JS. Un exemple écrit en Vanilla JS apparaîtra dans le problème, donc si vous n'utilisez pas jQuery, il peut être plus rapide d'y faire référence.

= f.button 'Envoyer', data: { disable_with: 'Envoi en cours…' }, class: 'disable_with_safari'

$('.disable-with-safari').click(function (event) {
  if ($(this).data('disableWith')) {
    $(this).prop('disabled', true);
    $(this).text($(this).data('disableWith'));
    var form = $(this).closest('form');
    if (form.length) {
      event.preventDefault();
      setTimeout(() => form.submit(), 300);
    }
  }
});

Remarques

Comme indiqué dans le numéro d'ouverture, les spécifications uniques de Safari semblent empêcher le DOM d'être mis à jour une fois qu'une soumission a été exécutée. (Puisqu'il s'agit d'un commentaire sur le problème, veuillez vous référer aux informations principales pour les spécifications exactes.) Par conséquent, même si disable_with a été ajouté, le libellé du bouton n'a pas changé.

Au fait, lorsque j'ai recherché ce problème, la solution suivante est apparue, mais dans mon cas, cela n'a pas fonctionné.

--Ajouter un curseur: pointeur; --Définir un événement de clic vide --Définir un événement touchstart vide

Remplacez la liaison par $ (document)

[JAVA] Si cela ne change pas avec l'option disable_with dans Safari

Solution

Remarques