2 files changed, 22 insertions, 4 deletions

diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
index 5cab9e9df..545e37857 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
@@ -292,6 +292,9 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
   }
 
   formValidated () {
+    this.forceCheck()
+    if (!this.form.valid) return
+
     const value: ComponentCustomConfig = this.form.getRawValue()
 
     forkJoin([
@@ -381,8 +384,7 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
         this.customConfig = { ...config, instanceCustomHomepage: homepage }
 
         this.updateForm()
-        // Force form validation
-        this.forceCheck()
+        this.markAllAsDirty()
       },
 
       error: err => this.notifier.error(err.message)
diff --git a/client/src/app/shared/shared-forms/form-reactive.ts b/client/src/app/shared/shared-forms/form-reactive.ts
index 6b3a6c773..a19ffdd82 100644
--- a/client/src/app/shared/shared-forms/form-reactive.ts
+++ b/client/src/app/shared/shared-forms/form-reactive.ts
@@ -1,5 +1,5 @@
 
-import { FormGroup } from '@angular/forms'
+import { AbstractControl, FormGroup } from '@angular/forms'
 import { wait } from '@root-helpers/utils'
 import { BuildFormArgument, BuildFormDefaultValues } from '../form-validators/form-validator.model'
 import { FormValidatorService } from './form-validator.service'
@@ -44,6 +44,21 @@ export abstract class FormReactive {
     } while (this.form.status === 'PENDING')
   }
 
+  protected markAllAsDirty (controlsArg?: { [ key: string ]: AbstractControl }) {
+    const controls = controlsArg || this.form.controls
+
+    for (const key of Object.keys(controls)) {
+      const control = controls[key]
+
+      if (control instanceof FormGroup) {
+        this.markAllAsDirty(control.controls)
+        continue
+      }
+
+      control.markAsDirty()
+    }
+  }
+
   protected forceCheck () {
     this.onStatusChanged(this.form, this.formErrors, this.validationMessages, false)
   }
@@ -59,7 +74,8 @@ export abstract class FormReactive {
         this.onStatusChanged(
           form.controls[field] as FormGroup,
           formErrors[field] as FormReactiveErrors,
-          validationMessages[field] as FormReactiveValidationMessages
+          validationMessages[field] as FormReactiveValidationMessages,
+          onlyDirty
         )
         continue
       }