Error message has been displayed incorrectly


Topic: Error message has been displayed incorrectly

mmielko pro asked 6 years ago

Error message for input field has been displayed incorrectly. Details below.
<Input label="Example label" className="invalid" error="Long error message hereeeeee" />

Details on image screenshot





Jakub Mandra staff premium answered 6 years ago

Hey, for validation we have prepared Validation component. Check out here   Best, Jakub

mmielko pro commented 6 years ago

I can see only example of how to use validation with bootstrap input fields. Could you show me example how to use it by using your <Input> component for react? 


Jakub Mandra staff premium commented 6 years ago

Ah yes, you can use it fully only with bootstrap styled inputs...

If you just replace input with our MDBInput it will only change border colors, the feedback message wont appear.

This functionality is not marked as priority right now, but we will come to it.


Jakub Mandra staff premium commented 6 years ago

But you can just add class md-form, as Ania wrote. 

Remember to delete labels, because this will break the layout.


Anna Morawska staff answered 6 years ago

Himmielko , please try to add to your css stylesheet additional rule as shown below:
.md-form label{
  width: 100%;
}
Best, Ania
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: No
  • Technology: MDB React
  • MDB Version: 4.7.1
  • Device: desktop
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes
Tags