From 7a7f12b83afcd32ad7085c33e1842b5dbf82ad41 Mon Sep 17 00:00:00 2001 From: "konstantina.galouni" Date: Tue, 16 Nov 2021 11:47:24 +0200 Subject: [PATCH] Fixed #7182: Required field names appearing in the warning modal. dataset-wizard.component.ts & dmp-editor.component.ts & form-validation-errors-dialog.component.ts: a. For 'mat-select', use placeholder instead of aria-label. b. [Bug fix] For 'app-multiple-auto-complete' dig into 2 more levels (formControl.nativeElement.firstChild.firstChild.firstChild.children) --> reason: commit de99784b5e: moved inside . --- .../dataset-wizard.component.ts | 38 +++++++++---------- .../app/ui/dmp/editor/dmp-editor.component.ts | 18 ++++----- ...form-validation-errors-dialog.component.ts | 7 ++-- 3 files changed, 32 insertions(+), 31 deletions(-) diff --git a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts index 014635465..be9129c88 100644 --- a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts +++ b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts @@ -408,7 +408,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // private _listenersSubscription:Subscription = new Subscription(); registerFormListeners() { - // const dmpSubscription = + // const dmpSubscription = this.formGroup.get('dmp').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { @@ -424,32 +424,32 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.formChanged(); } }); - // const labelSubscription = + // const labelSubscription = this.formGroup.get('label').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { this.formChanged(); }); - // const descriptionSubscription = + // const descriptionSubscription = this.formGroup.get('description').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { this.formChanged(); }); - // const uriSubscription = + // const uriSubscription = this.formGroup.get('uri').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { this.formChanged(); }); - // const tagsSubscription = + // const tagsSubscription = this.formGroup.get('tags').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { this.formChanged(); }); if (this.formGroup.get('datasetProfileDefinition')) { - // const datasetProfileDefinitionSubscription = + // const datasetProfileDefinitionSubscription = this.formGroup.get('datasetProfileDefinition').valueChanges .pipe(takeUntil(this._destroyed)) .subscribe(x => { @@ -555,7 +555,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.formGroup.addControl('datasetProfileDefinition', this.datasetProfileDefinitionModel.buildForm()); // const datasetProfileDefinitionForm = this.datasetProfileDefinitionModel.buildForm(); - + // let profId = null; // try{ // profId = this.formGroup.get('profile').value.id; @@ -651,11 +651,11 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme || formControl.nativeElement.localName === 'richTextarea') { return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'mat-select') { - return formControl.nativeElement.getAttribute('aria-label'); + return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-single-auto-complete') { return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-multiple-auto-complete') { - return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); + return (Array.from(formControl.nativeElement.firstChild.firstChild.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } } @@ -687,7 +687,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme } } const errorMessage = this._getErrorMessage(aControl, controlName); - + errmess.push(...errorMessage); } @@ -695,7 +695,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme No need to check case of FormControl below*/ if(aControl instanceof FormGroup){ - + const fg = aControl as FormGroup; //check children Object.keys(fg.controls).forEach(controlName=>{ @@ -708,7 +708,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme fa.controls.forEach((control,index)=>{ errmess.push(... this._buildErrorMessagesForAbstractControl(control, `${controlName} --> ${index+1}`)); }); - + } } @@ -729,7 +729,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme if (!this.isSemiFormValid(this.formGroup)) { //build messages const errorMessages = this._buildSemiFormErrorMessages(); - this.showValidationErrorsDialog(undefined, errorMessages); + this.showValidationErrorsDialog(undefined, errorMessages); this.hintErrors = true; return; } @@ -1153,7 +1153,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // }else{ // this.formGroup.get(key).reset(); // } - + // } // }); } else { @@ -1252,7 +1252,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // const tempResult:ToCEntry[] = []; - + // if(sections &§ions.length){ // sections.controls.forEach(section=>{ // tempResult.push(this._buildRecursively(section as FormGroup, ToCEntryType.Section)); @@ -1288,9 +1288,9 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // } // private _sortByOrdinal(tocentries: ToCEntry[]){ - + // if(!tocentries || !tocentries.length) return; - + // tocentries.sort(this._customCompare); // tocentries.forEach(entry=>{ // this._sortByOrdinal(entry.subEntries); @@ -1315,7 +1315,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // }); // } - + // getTocEntries(form): ToCEntry[] { // if (form == null) { return []; } // const result: ToCEntry[] = []; @@ -1355,6 +1355,6 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme // } - + } diff --git a/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.ts b/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.ts index 7e5e148d0..8baa9e0e8 100644 --- a/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.ts +++ b/dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.ts @@ -583,7 +583,7 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements try{ showDialog = this.isNew && !this.formGroup.get('datasets').value.length; }catch{ - + } this.editDataset(dmp.id, true, showDialog); @@ -825,11 +825,11 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements || formControl.nativeElement.localName === 'richTextarea') { return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'mat-select') { - return formControl.nativeElement.getAttribute('aria-label'); + return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-single-auto-complete') { return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-multiple-auto-complete') { - return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); + return (Array.from(formControl.nativeElement.firstChild.firstChild.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } } @@ -861,14 +861,14 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements } } const errorMessage = this._getErrorMessage(aControl, controlName); - + errmess.push(...errorMessage); } /*in case the aControl is FormControl then the it should have provided its error messages above. No need to check case of FormControl below*/ if(aControl instanceof FormGroup){ - + const fg = aControl as FormGroup; //check children Object.keys(fg.controls).forEach(controlName=>{ @@ -881,9 +881,9 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements fa.controls.forEach((control,index)=>{ errmess.push(... this._buildErrorMessagesForAbstractControl(control, `${controlName} --> ${index+1}`)); }); - + } - + } return errmess; @@ -950,7 +950,7 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements editDataset(id: string, isNew: boolean, showModal:boolean = false) { - + if(showModal){ const dialogRef = this.dialog.open(DmpToDatasetDialogComponent, { width: '500px', @@ -972,7 +972,7 @@ export class DmpEditorComponent extends CheckDeactivateBaseComponent implements } else { this.router.navigate(['/datasets', 'edit', id]); } - + } diff --git a/dmp-frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.ts b/dmp-frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.ts index b01d262f7..7d4d14a33 100644 --- a/dmp-frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.ts +++ b/dmp-frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.ts @@ -70,14 +70,15 @@ export class FormValidationErrorsDialogComponent { } getPlaceHolder(formControl: any): string { - if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea') { + if (formControl.nativeElement.localName === 'input' || formControl.nativeElement.localName === 'textarea' + || formControl.nativeElement.localName === 'richTextarea') { return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'mat-select') { - return formControl.nativeElement.getAttribute('aria-label'); + return formControl.nativeElement.getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-single-auto-complete') { return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } else if (formControl.nativeElement.localName === 'app-multiple-auto-complete') { - return (Array.from(formControl.nativeElement.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); + return (Array.from(formControl.nativeElement.firstChild.firstChild.firstChild.children).filter((x: any) => x.localName === 'input')[0] as any).getAttribute('placeholder'); } // Needs to have in in html in order to fill results