mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-3459] fix datepicker validation regression (#3697)
* fix datepicker validation regression * improved validation message * update libs
This commit is contained in:
committed by
Eugenio Romano
parent
9ac4dba207
commit
d39de25fe9
@@ -10,14 +10,8 @@
|
||||
(focusout)="onChangedHandler($event, from)">
|
||||
<mat-datepicker-toggle matSuffix [for]="fromDatepicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #fromDatepicker></mat-datepicker>
|
||||
<mat-error *ngIf="from.hasError('required') && !hasParseError(from)">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' | translate }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="from.hasError('matDatepickerMax')">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' | translate }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="hasParseError(from)">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.INVALID-DATE' | translate: { requiredFormat: datePickerDateFormat } }}
|
||||
<mat-error *ngIf="from.invalid">
|
||||
{{ getFromValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -33,17 +27,8 @@
|
||||
(focusout)="onChangedHandler($event, to)">
|
||||
<mat-datepicker-toggle matSuffix [for]="toDatepicker"></mat-datepicker-toggle>
|
||||
<mat-datepicker #toDatepicker></mat-datepicker>
|
||||
<mat-error *ngIf="to.hasError('required') && !hasParseError(to)">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' | translate }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="to.hasError('matDatepickerMin')">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.NO-DAYS' | translate }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="to.hasError('matDatepickerMax')">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' | translate }}
|
||||
</mat-error>
|
||||
<mat-error *ngIf="hasParseError(to)">
|
||||
{{ 'SEARCH.FILTER.VALIDATION.INVALID-DATE' | translate: { requiredFormat: datePickerDateFormat } }}
|
||||
<mat-error *ngIf="to.invalid">
|
||||
{{ getToValidationMessage() | translate: { requiredFormat: datePickerDateFormat } }}
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
|
@@ -60,6 +60,21 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
|
||||
private userPreferencesService: UserPreferencesService) {
|
||||
}
|
||||
|
||||
getFromValidationMessage(): string {
|
||||
return this.from.hasError('matDatepickerParse') ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' :
|
||||
this.from.hasError('matDatepickerMax') ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' :
|
||||
this.from.hasError('required') ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' :
|
||||
'';
|
||||
}
|
||||
|
||||
getToValidationMessage(): string {
|
||||
return this.to.hasError('matDatepickerParse') ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' :
|
||||
this.to.hasError('matDatepickerMin') ? 'SEARCH.FILTER.VALIDATION.NO-DAYS' :
|
||||
this.to.hasError('matDatepickerMax') ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' :
|
||||
this.to.hasError('required') ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' :
|
||||
'';
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (this.settings) {
|
||||
this.datePickerDateFormat = this.settings.dateFormat || DEFAULT_FORMAT_DATE;
|
||||
@@ -107,13 +122,17 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
onChangedHandler(event: any, formControl) {
|
||||
onChangedHandler(event: any, formControl: FormControl) {
|
||||
const inputValue = event.srcElement.value;
|
||||
|
||||
if (inputValue) {
|
||||
const formatDate = this.dateAdapter.parse(inputValue, this.datePickerDateFormat);
|
||||
if (formatDate && formatDate.isValid()) {
|
||||
formControl.setValue(formatDate);
|
||||
} else {
|
||||
formControl.setErrors({
|
||||
'matDatepickerParse': true
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -123,10 +142,6 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit {
|
||||
moment.locale(locale);
|
||||
}
|
||||
|
||||
hasParseError(formControl) {
|
||||
return formControl.hasError('matDatepickerParse') && formControl.getError('matDatepickerParse').text;
|
||||
}
|
||||
|
||||
forcePlaceholder(event: any) {
|
||||
event.srcElement.click();
|
||||
}
|
||||
|
Reference in New Issue
Block a user