BIB-13: Implement measures to protect unsaved data while form is bein…

…g saved - Set isDirty=true on form submission in order to trigger the existing unsaved change alert when trying to close/reload the tab while saving the form. - Add warning text to save/submit button.
libris · Feb 24, 2020 · 2858d35 · 2858d35
1 parent a1228a4
commit 2858d35
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/libstat/templates/libstat/survey.html b/libstat/templates/libstat/survey.html
@@ -277,7 +277,7 @@ <h4 class="modal-title" id="confirm-submit-title">Är du säker på att du vill
                 <div class="modal-footer">
                     <a href="#" id="cancel-submit-survey-btn" class="btn btn-danger" data-dismiss="modal">Avbryt</a>
                     <a href="#" id="confirm-submit-survey-btn" class="btn btn-success spinner"
-                            data-spinner-text="Skickar..." data-spinner-disable="#cancel-submit-survey-btn">Skicka</a>
+                            data-spinner-text="Skickar... (STÄNG EJ WEBBLÄSARFLIKEN)" data-spinner-disable="#cancel-submit-survey-btn">Skicka</a>
                 </div>
             </div>
         </div>

diff --git a/static/js/app/survey.js b/static/js/app/survey.js
@@ -358,6 +358,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
 
                 }).on('error.validator.bv', function (e, data) { // http://bootstrapvalidator.com/examples/changing-default-behaviour/#showing-one-message-each-time
 
+                    isDirty = true;
                     var submit_action = $('#submit_action').val();
                     var showValMessage = $('#valMessageShown').val();
 
@@ -391,6 +392,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                     if (!submit_action)
                         return;
 
+                    isDirty = true;
                     $('#valMessageShown').val('false');
 
                     var continuePosting = true; //continue posting if sum checks are passed
@@ -541,11 +543,11 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                         // On successful form-format-validation and sum checks, if submit_action -> ajax post form
 
                         if (submit_action == "save") {
-                            $('#save-survey-btn').html('<i class="fa fa-spinner fa-spin"></i> Sparar...');
+                            $('#save-survey-btn').html('<i class="fa fa-spinner fa-spin"></i> Sparar... (STÄNG EJ WEBBLÄSARFLIKEN)');
                         } else if (submit_action == "presubmit") {
-                            $('#submit-survey-button').html('<i class="fa fa-spinner fa-spin"></i> Sparar...');
+                            $('#submit-survey-button').html('<i class="fa fa-spinner fa-spin"></i> Sparar... (STÄNG EJ WEBBLÄSARFLIKEN)');
                         } else if (submit_action == "submit") {
-                            $('#submit-survey-button').html('<i class="fa fa-spinner fa-spin"></i> Skickar...');
+                            $('#submit-survey-button').html('<i class="fa fa-spinner fa-spin"></i> Skickar... (STÄNG EJ WEBBLÄSARFLIKEN)');
                         }
 
                         $('#altered_fields').val(survey.changeableInputs().filter(function () {
@@ -757,6 +759,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                 survey.form('#save-survey-btn').click(function (e) {
                     e.preventDefault();
 
+                    isDirty = true;
                     $('#submit_action').val('save');
 
                     if ($('#valMessageShown').length) {
@@ -769,7 +772,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                     var saveButtonHtml = saveButton.html();
                     var otherButtons = $('#submit-survey-btn,#print-survey-btn');
 
-                    saveButton.html('<i class="fa fa-spinner fa-spin"></i> Kontrollerar...').addClass('disabled');
+                    saveButton.html('<i class="fa fa-spinner fa-spin"></i> Kontrollerar... (STÄNG EJ WEBBLÄSARFLIKEN)').addClass('disabled');
                     otherButtons.addClass('disabled');
 
                     setTimeout(function () {
@@ -785,6 +788,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                 survey.form('#submit-survey-btn').click(function (e) {
                     e.preventDefault();
 
+                    isDirty = true;
                     $('#submit_action').val('presubmit');
 
                     if ($('#valMessageShown').length) {
@@ -797,7 +801,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                     var submitButtonHtml = submitButton.html();
                     var otherButtons = $('#save-survey-btn,#print-survey-btn');
 
-                    submitButton.html('<i class="fa fa-spinner fa-spin"></i> Kontrollerar...').addClass('disabled');
+                    submitButton.html('<i class="fa fa-spinner fa-spin"></i> Kontrollerar... (STÄNG EJ WEBBLÄSARFLIKEN)').addClass('disabled');
                     otherButtons.addClass('disabled');
 
                     setTimeout(function () {
@@ -846,6 +850,7 @@ define(['jquery', 'bootbox', 'survey.sum', 'survey.cell', 'surveys.dispatch', 'b
                 $('#confirm-submit-survey-btn').click(function (e) {
                     e.preventDefault();
 
+                    isDirty = true;
                     $('#submit_action').val('submit');
 
                     setTimeout(function () {