When checking for Form Validation errors if the control has no nativeElement then pass as name it's formGroup key, also added some additional checkup for the placeholder parser in the FormValidationComponent

This commit is contained in:
George Kalampokis 2020-10-13 12:55:11 +03:00
parent b878bf9d8f
commit f08d8e2e01
2 changed files with 21 additions and 12 deletions

View File

@ -413,6 +413,7 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
} }
public isFormValid() { public isFormValid() {
this.formGroup.markAllAsTouched();
return this.formGroup.valid; return this.formGroup.valid;
// return this.formGroup.get('label').valid && this.formGroup.get('profiles').valid && // return this.formGroup.get('label').valid && this.formGroup.get('profiles').valid &&
// (this.formGroup.get('funder').get('label').valid || this.formGroup.get('funder').get('existFunder').valid) && // (this.formGroup.get('funder').get('label').valid || this.formGroup.get('funder').get('existFunder').valid) &&

View File

@ -29,15 +29,23 @@ export class FormValidationErrorsDialogComponent {
this.dialogRef.close(); this.dialogRef.close();
} }
public getErrors(formControl: AbstractControl): string[] { public getErrors(formControl: AbstractControl, key?: string): string[] {
const errors: string[] = []; const errors: string[] = [];
if (formControl instanceof FormControl) { if (formControl instanceof FormControl) {
if (formControl.invalid && formControl['nativeElement']) { errors.push(...this.getErrorMessage(formControl)); } if (formControl.errors !== null) {
let name: string;
if ((<any>formControl).nativeElement !== undefined && (<any>formControl).nativeElement !== null) {
name = this.getPlaceHolder(formControl);
} else {
name = key;
}
errors.push(...this.getErrorMessage(formControl, name));
}
} else if (formControl instanceof FormGroup) { } else if (formControl instanceof FormGroup) {
if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); } if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); }
Object.keys(formControl.controls).forEach(item => { Object.keys(formControl.controls).forEach(key => {
const control = formControl.get(item); const control = formControl.get(key);
errors.push(...this.getErrors(control)); errors.push(...this.getErrors(control, key));
}); });
} else if (formControl instanceof FormArray) { } else if (formControl instanceof FormArray) {
if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); } if (formControl.errors) { (errors.push(...Object.values(formControl.errors).map(x => x.message) as string[])); }
@ -48,21 +56,21 @@ export class FormValidationErrorsDialogComponent {
return errors; return errors;
} }
getErrorMessage(formControl: FormControl): string[] { getErrorMessage(formControl: FormControl, name: string): string[] {
const errors: string[] = []; const errors: string[] = [];
Object.keys(formControl.errors).forEach(key => { Object.keys(formControl.errors).forEach(key => {
if (key === 'required') { errors.push(this.language.instant(this.getPlaceHolder(formControl) + ": " + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED'))); } if (key === 'required') { errors.push(this.language.instant(name + ": " + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED'))); }
// if (key === 'required') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED')); } // if (key === 'required') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.REQUIRED')); }
else if (key === 'email') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.EMAIL')); } else if (key === 'email') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.EMAIL')); }
else if (key === 'min') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MIN-VALUE', { 'min': formControl.getError('min').min })); } else if (key === 'min') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MIN-VALUE', { 'min': formControl.getError('min').min })); }
else if (key === 'max') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MAX-VALUE', { 'max': formControl.getError('max').max })); } else if (key === 'max') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MAX-VALUE', { 'max': formControl.getError('max').max })); }
else { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + this.getPlaceHolder(formControl) + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + formControl.errors[key].message); } else { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + formControl.errors[key].message); }
}); });
return errors; return errors;
} }
getPlaceHolder(formControl: any): string { getPlaceHolder(formControl: any): string {
if (formControl.nativeElement.localName === 'input') { if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea') {
return formControl.nativeElement.getAttribute('placeholder'); return formControl.nativeElement.getAttribute('placeholder');
} else if (formControl.nativeElement.localName === 'mat-select') { } else if (formControl.nativeElement.localName === 'mat-select') {
return formControl.nativeElement.getAttribute('aria-label'); return formControl.nativeElement.getAttribute('aria-label');