diff options
author | Chocobozzz <me@florianbigard.com> | 2018-06-05 10:58:45 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2018-06-05 10:58:45 +0200 |
commit | d18d64787b3ea174f7dc2740c8c8c9555625047e (patch) | |
tree | e65089e0ca81117c1ada981b9b8a524afa8d70f5 /client/src/app/shared/forms/form-reactive.ts | |
parent | 25acef90a85c1584880dec96aa402f896af8364a (diff) | |
download | PeerTube-d18d64787b3ea174f7dc2740c8c8c9555625047e.tar.gz PeerTube-d18d64787b3ea174f7dc2740c8c8c9555625047e.tar.zst PeerTube-d18d64787b3ea174f7dc2740c8c8c9555625047e.zip |
Form validators refractoring
Diffstat (limited to 'client/src/app/shared/forms/form-reactive.ts')
-rw-r--r-- | client/src/app/shared/forms/form-reactive.ts | 52 |
1 files changed, 30 insertions, 22 deletions
diff --git a/client/src/app/shared/forms/form-reactive.ts b/client/src/app/shared/forms/form-reactive.ts index e7764d069..441ec8203 100644 --- a/client/src/app/shared/forms/form-reactive.ts +++ b/client/src/app/shared/forms/form-reactive.ts | |||
@@ -1,40 +1,48 @@ | |||
1 | import { FormGroup } from '@angular/forms' | 1 | import { FormGroup } from '@angular/forms' |
2 | import { BuildFormArgument, BuildFormDefaultValues, FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' | ||
3 | |||
4 | export type FormReactiveErrors = { [ id: string ]: string } | ||
5 | export type FormReactiveValidationMessages = { | ||
6 | [ id: string ]: { | ||
7 | [ name: string ]: string | ||
8 | } | ||
9 | } | ||
2 | 10 | ||
3 | export abstract class FormReactive { | 11 | export abstract class FormReactive { |
4 | abstract form: FormGroup | 12 | protected abstract formValidatorService: FormValidatorService |
5 | abstract formErrors: Object | ||
6 | abstract validationMessages: Object | ||
7 | 13 | ||
8 | abstract buildForm (): void | 14 | form: FormGroup |
15 | formErrors: FormReactiveErrors | ||
16 | validationMessages: FormReactiveValidationMessages | ||
9 | 17 | ||
10 | protected onValueChanged (data?: any) { | 18 | buildForm (obj: BuildFormArgument, defaultValues: BuildFormDefaultValues = {}) { |
11 | for (const field in this.formErrors) { | 19 | const { formErrors, validationMessages, form } = this.formValidatorService.buildForm(obj, defaultValues) |
12 | // clear previous error message (if any) | ||
13 | this.formErrors[field] = '' | ||
14 | const control = this.form.get(field) | ||
15 | 20 | ||
16 | if (control && control.dirty && !control.valid) { | 21 | this.form = form |
17 | const messages = this.validationMessages[field] | 22 | this.formErrors = formErrors |
18 | for (const key in control.errors) { | 23 | this.validationMessages = validationMessages |
19 | this.formErrors[field] += messages[key] + ' ' | 24 | |
20 | } | 25 | this.form.valueChanges.subscribe(data => this.onValueChanged(false)) |
21 | } | ||
22 | } | ||
23 | } | 26 | } |
24 | 27 | ||
25 | // Same as onValueChanged but force checking even if the field is not dirty | 28 | protected onValueChanged (forceCheck = false) { |
26 | protected forceCheck () { | ||
27 | for (const field in this.formErrors) { | 29 | for (const field in this.formErrors) { |
28 | // clear previous error message (if any) | 30 | // clear previous error message (if any) |
29 | this.formErrors[field] = '' | 31 | this.formErrors[ field ] = '' |
30 | const control = this.form.get(field) | 32 | const control = this.form.get(field) |
31 | 33 | ||
32 | if (control && !control.valid) { | 34 | // Don't care if dirty on force check |
33 | const messages = this.validationMessages[field] | 35 | const isDirty = control.dirty || forceCheck === true |
36 | if (control && isDirty && !control.valid) { | ||
37 | const messages = this.validationMessages[ field ] | ||
34 | for (const key in control.errors) { | 38 | for (const key in control.errors) { |
35 | this.formErrors[field] += messages[key] + ' ' | 39 | this.formErrors[ field ] += messages[ key ] + ' ' |
36 | } | 40 | } |
37 | } | 41 | } |
38 | } | 42 | } |
39 | } | 43 | } |
44 | |||
45 | protected forceCheck () { | ||
46 | return this.onValueChanged(true) | ||
47 | } | ||
40 | } | 48 | } |