Only allow dashboard edit-item submission and confirm that the user wants to go back when the user presses the back button after changes have been made

resources/assets/js/dashboard.js

@@ -269,7 +269,8 @@ function editItemInit() {
         formData = {},
         submitting = false,
         hours,
-        minutes;
+        minutes,
+        changes = false;
 
     // show the loading modal
     const showLoadingModal = function() {
@@ -430,18 +431,28 @@ function editItemInit() {
         }, 100);
     });
 
+    // initialize change events for back button
+    $editItem.find("input, textarea, select").on("input change", function() {
+        changes = true;
+        $submit.removeClass("disabled");
+    });
+
     // initialize back button
     $backButton.on("click", function() {
         if (!submitting) {
-            askConfirmation("Cancel and return to the " + path + " list?", function() {
+            if (changes) {
+                askConfirmation("Cancel changes and return to the list?", function() {
+                    window.location.href = "/dashboard/" + path;
+                });
+            } else {
                 window.location.href = "/dashboard/" + path;
-            });
+            }
         }
     });
 
     // initialize submit button
     $submit.on("click", function() {
-        if (!submitting) {
+        if (!submitting && changes) {
             submitting = true;
 
             // show the loading modal

resources/assets/sass/dashboard.scss

@@ -367,7 +367,14 @@ body {
     }
 
     .back-button { float: left; }
-    .submit-button { float: right; }
+
+    .submit-button {
+        float: right;
+
+        &.disabled {
+            pointer-events: none;
+        }
+    }
 
     .back-button, .submit-button {
         margin: 25px 15px 15px 15px;

resources/views/dashboard/edit-item.blade.php

@@ -65,7 +65,7 @@
 
             <div class="row">
                 <button id="back" type="button" class="back-button btn btn-default">Back</button>
-                <button id="submit" type="button" class="submit-button btn btn-primary">{{ $id == 'new' ? 'Create' : 'Update' }} {{ $heading }} Item</button>
+                <button id="submit" type="button" class="submit-button btn btn-primary disabled">{{ $id == 'new' ? 'Create' : 'Update' }} {{ $heading }} Item</button>
             </div>
         </div>
     </form>