Ngx-bootstrap: feat(daterangepicker): add date validity validation

Created on 9 Jan 2018  路  3Comments  路  Source: valor-software/ngx-bootstrap

If you mark the input for the Daterangepicker as required in your HTML, then type some random text and press Tab to move to the next input, Daterangepicker will remove that "bad" text (as expected), but the input itself will still be valid (ng-valid class gets injected by Angular).

Initial state:
image

Invalid text entered:
image

After control looses focus:
image

comp(datepicker) enhancement

Most helpful comment

@valorkin what is the solution could you please explain?

All 3 comments

Hi,
I am unable to validate using custom validator on datepicker while entering junk data it returns Invalid Date.
For Blank input field validation is working fine as shown in figure
datepicker

But when i am entering character or junk data it returns Invalid date but i am unable to apply angular validation. Please help
datepicker2

HTML Code for This





From Date is required

Please Enter Valid Date

TS file code
this.rrfForm.get('rrf_temp_tenure_from_date').setValidators([Validators.required, ValidationService.dateValidator]);

Service function

static dateValidator(control) {
if (control.value.match(/^(0[1-9]|1\d|2\d|3[01]).(0[1-9]|1[0-2]).(19|20)\d{2}$/)) {
return null;
} else {
return { 'invalidPassword': true };
}
}

Getting Error on Console :
image

Added

@valorkin what is the solution could you please explain?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Nav Dropdown and responsive menu not working
juanitavollmering picture juanitavollmering  路  3Comments

Integrating Simple Typeahead
webdev48 picture webdev48  路  3Comments

Vertical positioning problem with tooltips when wrapping text
KimBum picture KimBum  路  3Comments

whether typeahead-editable feautre is available ?
ravirajhalli picture ravirajhalli  路  3Comments

Question - Load dropdown menu from anywhere
pgeyman picture pgeyman  路  3Comments