mdb-select is missing tooltip

itay pro commented 5 years ago

I know but it is still missing. And if the select has no value, the label is missing

Arkadiusz Idzikowski staff commented 5 years ago

That's because label is hidden behind select input when it's not active. You could change that by modifying label z-index styles, but please note that it will affect input functionality (you won't be able to open select dropdown by clicking on inactive label).

.md-form mdb-select + label { z-index: 900; }

itay pro commented 5 years ago

The problem is that if there is no value (value is undefined), even if the label is marked with class="active", once rendered, the class is cleared.

Adding it manually in dev tools, does lift the label to its location.

Why is the class cleared ?

     <div class="md-form">
            <mdb-select formControlName="start" id="start" [options]="periods" [visibleOptions]="10" [disabled]="!show"></mdb-select>
            <label for="start" class="active" mdbTooltip="this is a tip">start ?</label>
     </div>

Arkadiusz Idzikowski staff commented 5 years ago

It is expected behavior. The active class will be automatically removed if there is no selected option/placeholder.

In this case you can add placeholder if there is no default value.

itay pro commented 5 years ago

It should not be the expected behavior because the label, not the place holder, is missing

Arkadiusz Idzikowski staff commented 5 years ago

I'm not sure if I understand the problem correctly.

If the components detects that there is no selected value/placeholder it remove active class from the label. This is expected behavior and it doesn't matter whether the active class was added automatically or manually.

You should use labels and placeholders to add description. Using additional tooltip is not common use case for this component, but it's still possible with the workaround I provided in the answer.

itay pro commented 5 years ago

Now, the issue is not the tooltip.

When the value is missing, the label also doesn't appear.

Check this screenshot: https://imgur.com/a/W0ow1DW

Arkadiusz Idzikowski staff commented 5 years ago

In this case it would be better to move the discussion to another ticket to avoid confusion. Please start a new thread and add some more information about the problem and reproduction steps (you can also consider updating the original question in this thread with new information if you think that this issues are related).

I just tried to reproduce this problem on different select configurations but without success. If you use any custom styles please include them as well in your new post.

itay pro commented 5 years ago

I started a new question https://mdbootstrap.com/support/angular/label-is-hidden-on-mdb-select-without-value/