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: mdb-select with styled label

itay pro asked 5 years ago


Ver 6.3.0 suggested (please excuse my late arrival):

  • Select - resolved problems with label styling. For the label to work correctly, we encourage you to add it via [ label ] input instead of HTML tag.

However, adding label attribute to instead of using a separate lacks the ability to style the color of the label and the ability to add tooltip to it using mdbTooltip.

e.g.

<label for="select1" class="active TextRed" mdbTooltip="TOOLTIP">"CAPTION</label>

The label cannot accept the color Red and the tooltip is narrow as the label and not as wide as input + it appears when hovering every select option


Damian Gemza staff answered 5 years ago


Dear @mdb2

With the @Input() you're passing the text which has to be rendered within the label to the <label> element inside the <mdb-select> component.

Best Regards,

Damian


itay pro answered 5 years ago


What does @Input() has to do with the label ?


Damian Gemza staff answered 5 years ago


Dear @mdb2

Yes, you should try to use the html <label> element after <mdb-select> like in the good old days.

What do you mean by "Using input should be a preferred way" ? We are talking about mdb-select, not input - the input in the context of Arek message is Angular @Input() mechanism, not the HTML <input> element.

Best Regards,

Damian


itay pro answered 5 years ago


Do you mean that I should add a different label after the mdb-select, like in the good old days, instead of using the [label] attribute ?

What do you mean by "Using input should be a preffered way" ? We are talking about mdb-select, not input


Arkadiusz Idzikowski staff answered 5 years ago


Using input should be a preffered way, but we recently made some changes to provide similiar functionality for html label. Please try to add the label tag after mdb-select and let us know if you encounter any problems.


itay pro answered 5 years ago


There are times where the text in the label is just not enough.

In such cases, adding tooltip over the label helps to convey more information, as tooltips usually do


Damian Gemza staff answered 5 years ago


Dear @mdb2

I don't think, that you should use Tooltip over the floating label.

Label element is used to describe the usage of a specific input. So for me, using Tooltip there is useless.

If you don't use the [label], you may have problems with the floating label in Select.

Best Regards,

Damian



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: 7.5.1
  • Device: NA
  • Browser: NA
  • OS: NA
  • Provided sample code: No
  • Provided link: No