Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Fix: Datepicker label losing "active" class despite the value being set

cyleph pro asked 7 years ago


Hi there,

I'm using the datepicker like this:

<mdb-date-picker name="start" label="Start" [options]="dpOtions" formControlName="start"></mdb-date-picker>

Error Description:
On init, the form looks fine, like the normal input fields with the label on the line. If I click the input/datepicker the modal shows up and in the background the label slides up (i.e. has class "active" attached), just like with normal input fields. When I select a date and close the modal the label slides down again (i.e. class "active" is gone).

Workaround
Set a placeholder, because the "checkActive()" method in datepicker.component checks for the placeholder length to be > 0. Sure works, but then the date field looks a littble bit out of place, since I don't use placeholders for my other inputs and it would be the only one with the label "up".

Proposed Fix (in datepicker.component.ts)

  checkActive() {
    return this.placeholder.length || this.showSelector || this.utilService.isInitializedDate(this.selectedDate);
  }

Adrian Sawicki free answered 7 years ago


Hello, Thanks for this workaround. We will think about it and add it to our next release scope.

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No
Tags