Merge pull request #976 from dod-ccpo/activate-next-buttons-to-form

Activate next buttons on TO form

js/components/checkbox_input.js

@@ -19,11 +19,20 @@ export default {
     }
   },
 
+  created: function() {
+    emitEvent('field-mount', this, {
+      optional: this.optional,
+      name: this.name,
+      valid: this.isChecked,
+    })
+  },
+
   methods: {
     onInput: function(e) {
       emitEvent('field-change', this, {
         value: e.target.checked,
         name: this.name,
+        valid: this.isChecked,
       })
     },
   },

js/mixins/form.js

@@ -1,6 +1,10 @@
 export default {
   props: {
     initialSelectedSection: String,
+    hasChanges: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   mounted: function() {
@@ -44,6 +48,20 @@ export default {
     },
   },
 
+  computed: {
+    canSave: function() {
+      const formValid = !this.invalid
+
+      if (formValid) {
+        return true
+      } else if (this.changed && formValid) {
+        return true
+      } else {
+        return false
+      }
+    },
+  },
+
   data: function() {
     return {
       changed: this.hasChanges,
@@ -51,11 +69,4 @@ export default {
       invalid: true,
     }
   },
-
-  props: {
-    hasChanges: {
-      type: Boolean,
-      default: false,
-    },
-  },
 }

templates/task_orders/builder_base.html

@@ -13,7 +13,7 @@
             <input
               type="submit"
               tabindex="0"
-              :disabled="!changed"
+              :disabled="!canSave"
               value="{{ next_button_text }}"
               form="to_form"
               class="usa-button usa-button-primary">