LP#1029601: Prevent duplicate holds from double clicks
authorDaniel Pearl <dpearl@cwmars.org>
Wed, 12 Dec 2018 17:51:07 +0000 (12:51 -0500)
committerJason Stephenson <jason@sigio.com>
Tue, 21 May 2019 16:52:25 +0000 (12:52 -0400)
Double clicking on hold submit buttons causes multiple holds to be
generated.  This commits adds code to disable the Submit button(s)
after the first click, so subsequent clicks don't "work" in unintended
ways.

Signed-off-by: Dan Pearl <dpearl@cwmars.org>
Signed-off-by: Jeff Davis <jdavis@sitka.bclibraries.ca>
Signed-off-by: Jason Stephenson <jason@sigio.com>
Open-ILS/src/templates/opac/parts/place_hold_result.tt2
Open-ILS/web/js/ui/default/opac/holds-validation.js

index b2513a6..009145a 100644 (file)
@@ -6,10 +6,18 @@
 
 <!-- TODO: CSS for big/strong-->
 
 
 <!-- TODO: CSS for big/strong-->
 
+<script>
+function disable_submit() {
+   var submit_element = document.getElementById("place_hold_submit");
+   submit_element.disabled = true;
+   return true;
+};
+</script>
+
 <div id='holds_box' class='canvas' style='margin-top: 6px;'>
     <h1>[% l('Place Hold') %]</h1>
 
 <div id='holds_box' class='canvas' style='margin-top: 6px;'>
     <h1>[% l('Place Hold') %]</h1>
 
-    <form method="post">
+    <form method="post" onsubmit="return disable_submit();">
         <input type="hidden" name="override" value="1" />
         [% FOR k IN ctx.orig_params.keys %]
         <input type="hidden" name="[% k %]" value="[% ctx.orig_params.$k | html %]" />
         <input type="hidden" name="override" value="1" />
         [% FOR k IN ctx.orig_params.keys %]
         <input type="hidden" name="[% k %]" value="[% ctx.orig_params.$k | html %]" />
@@ -85,7 +93,7 @@
                                 );
                             </script>
                         [% END %]
                                 );
                             </script>
                         [% END %]
-
+                        
                         [% ELSIF hdata.hold_failed; any_failures = 1 %]
 
                             <div><big><strong>[% l("Hold was not successfully placed"); %]</strong></big></div>
                         [% ELSIF hdata.hold_failed; any_failures = 1 %]
 
                             <div><big><strong>[% l("Hold was not successfully placed"); %]</strong></big></div>
                 [% |l %]You have permission to override some of the failed holds. Click Submit to override and place your hold on the selected items.[% END %]
             </div>
             <span style='padding-right: 10px;'>
                 [% |l %]You have permission to override some of the failed holds. Click Submit to override and place your hold on the selected items.[% END %]
             </div>
             <span style='padding-right: 10px;'>
-                <input type="submit" name="submit" value="[% l('Submit') %]"
+                <input id="place_hold_submit" type="submit" name="submit" value="[% l('Submit') %]"
                     title="[% l('Submit') %]" alt="[% l('Submit') %]"
                     class="opac-button" />
             </span>
                     title="[% l('Submit') %]" alt="[% l('Submit') %]"
                     class="opac-button" />
             </span>
index 7345e3f..688d5da 100644 (file)
@@ -75,7 +75,12 @@ function confirmMultipleHolds() {
 function validateHoldForm() {
     var res = validateMethodSelections(document.getElementsByClassName("hold-alert-method"));
     if (res.isValid) {
 function validateHoldForm() {
     var res = validateMethodSelections(document.getElementsByClassName("hold-alert-method"));
     if (res.isValid) {
-        return confirmMultipleHolds();
+        var result = confirmMultipleHolds();
+        if (result) {
+           var submit_element = document.getElementById("place_hold_submit");
+            submit_element.disabled = true;
+        }
+        return result;
     } else {
         alert(eg_opac_i18n.EG_MISSING_REQUIRED_INPUT);
         res.culpritNames.forEach(function(n){
     } else {
         alert(eg_opac_i18n.EG_MISSING_REQUIRED_INPUT);
         res.culpritNames.forEach(function(n){