From 57f1ea03661945f75cf2ff11120eb07447692c99 Mon Sep 17 00:00:00 2001 From: silverwind Date: Thu, 11 Aug 2022 05:54:34 +0200 Subject: [PATCH] Fix loading button with invalid form (#20754) Previously, if a invalid form was submitted (for example issue with no title), the form could not be re-submitted again because the button would not stay stuck in loading state. Fix that by hooking the 'submit' event instead which triggers only when the form is valid. Co-authored-by: Lunny Xiao --- web_src/js/features/common-global.js | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/web_src/js/features/common-global.js b/web_src/js/features/common-global.js index 1776f6577d9aa..259e409add3e6 100644 --- a/web_src/js/features/common-global.js +++ b/web_src/js/features/common-global.js @@ -142,16 +142,12 @@ export function initGlobalCommon() { } }); - // loading-button this logic used to prevent push one form more than one time - $(document).on('click', '.button.loading-button', function (e) { - const $btn = $(this); - - if ($btn.hasClass('loading')) { - e.preventDefault(); - return false; - } - - $btn.addClass('loading disabled'); + // prevent multiple form submissions on forms containing .loading-button + document.addEventListener('submit', (e) => { + const btn = e.target.querySelector('.loading-button'); + if (!btn) return; + if (btn.classList.contains('loading')) return e.preventDefault(); + btn.classList.add('loading'); }); }