bug #2425 Prevent multiple form submissions when creating entities (j…

…aviereguiluz)

This PR was squashed before being merged into the 1.x branch (closes #2425).

Discussion
----------

Prevent multiple form submissions when creating entities

This fixes #2422.

The code was adapted from this article: https://andy-carter.com/blog/disable-multiple-form-submits-with-vanilla-javascript

The timeout idea was borrowed from the smart folks of SonataAdmin: https://github.com/sonata-project/SonataAdminBundle/blob/57a4c4ec8961d910ec8f4087cc96b7d77df6da33/src/Resources/public/Admin.js#L728-L731

Commits
-------

9480cde Prevent multiple form submissions when creating entities

src/Resources/views/default/new.html.twig

@@ -30,6 +30,18 @@
             $('.new-form').areYouSure({ 'message': '{{ 'form.are_you_sure'|trans({}, 'EasyAdminBundle')|e('js') }}' });
 
             $('.form-actions').easyAdminSticky();
+
+            // prevent multiple form submissions to avoid creating duplicated entities
+            var form = document.querySelector('form.new-form');
+            form.addEventListener('submit', function() {
+                // this timeout is needed to include the disabled button into the submitted form
+                setTimeout(function() {
+                    var submitButtons = form.querySelectorAll('[type="submit"]');
+                    submitButtons.forEach(function(button) {
+                        button.setAttribute('disabled', 'disabled');
+                    });
+                }, 1);
+            }, false);
         });
     </script>