Weird behaviour with input labels on all browsers - Angular


Topic: Weird behaviour with input labels on all browsers - Angular

MY PILOT LOG pro premium asked 2 years ago

I have made a simple registration from for my website: I am currently having an issue with this.

On the email input, when I type in a email address the label move to the top of the input box, as expected, but when I click off the email field then the label moves back over the inputted email, as in the image. I am wondering if anyone can help fix this.

Example

Here is a replication of the problem on github using the non pro version: https://github.com/akshayp1994/testexample


Arkadiusz Idzikowski staff answered 2 years ago

This is the correct syntax for the input fields in MDB Angular 5:

<mdb-form-control>
  <input mdbInput type="text" id="form1" class="form-control" />
  <label mdbLabel class="form-label" for="form1">Example label</label>
</mdb-form-control>

You can find more information in our documentation: https://mdbootstrap.com/docs/angular/forms/input-fields/

There is also a problem where the input directive cannot detect value changes made by browser autocomplete. We are currently working on a fix, but for now, we recommend turning that feature off on every input.


Andy Nguyen answered 2 years ago

Hi,

How do I get the form input value and how to validate it in angular. I am about to subscribe but if it is not easy to get input form or valid date it like the standard angular provied... then it is not worth it. I cannot find any example how to use mdb get input and validate in angular.

Thanks, Andy Email/label>


Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 2.3.0
  • Device: Laptop
  • Browser: All
  • OS: Linux
  • Provided sample code: No
  • Provided link: Yes