335
Views
9
Comments
Solved
[OutSystems UI] DropdownSearch (Reactive): Tooltip for the selected item is not displayed
outsystems-ui
Reactive icon
Forge asset by OutSystems
Application Type
Reactive

Hi,

I have a DropdownSearch block filled with long texts. When I select one of them, the whole text of this item cannot be displayed and is truncated using ellipsis - like below:

But when we look at the HTML we can see the below markup:

It looks like prepared to display the tooltip, containing full text of the item. But the tooltip is not displayed. 

Does anybody know, what should be done to make it working?

Regards

Tomasz M. Lipiński

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Tomasz,

To make the DropdownSearch widget Tooltip feature work - you need to explicitly reference the supporting JS/CSS files which OutSystemsUI doesn't includes by default.

Under the hood, OutSystems reference the VirtualSelect JS library for the DropdownSearch widget.

Refer to the attached oml.

Demo app: DropdownSearchWithTooltipTask

I hope this helps you!


Kind regards,

Benjith Sam

RWA_Lab_SearchDropdownTooltipTask.oml
2024-10-25 09-14-42
Christopher Bautista

Hi Tomas, are you using the latest version of Outsystems UI as your base theme?


UserImage.jpg
Gayathri Gali

Thanks for the response, 

I saw your oml file but I did not understand how did you get the tooltip



UserImage.jpg
Tomasz M Lipinski

Hi,

the key is to include the tooltip_min_js.js script file:

You can copy this file from the attached .oml or download it from this place.

Regards

Tomasz

UserImage.jpg
Gayathri Gali

I'm working in my project on VM. I guess its not possible for me to download githu files. Is there any other solution?

UserImage.jpg
Tomasz M Lipinski

Hi,

Please, find this file attached.

You guess that it is impossible to download the file or you have tried and you are sure? It is an open site so it should be possible.

As an alternative - have you tried to open the Benjith's .oml? I yes - just copy & paste the required file.

Regards

Tomasz

UserImage.jpg
Tomasz M Lipinski

Hi,

Please, find this file attached (remove trailing "xxx").

You guess that it is impossible to download the file or you have tried and you are sure? It is an open site so it should be possible.

As an alternative - have you tried to open the Benjith's .oml? I yes - just copy & paste the required file.

Regards

Tomasz

UserImage.jpg
Tomasz M Lipinski

Hi,

You guess that it is impossible to download the file or you have tried and you are sure? It is an open site so it should be possible.

As an alternative - have you tried to open the Benjith's .oml? I yes - just copy & paste the required file.

Unfortunately, it is not allowed to attach this file here.

Regards

Tomasz

2021-08-31 12-13-44
Jéssica Mendes
Staff

Hi @Tomasz M Lipinski,

Thank you for your feedback! 
The tooltip is a feature offered by our provider (VirtualSelect), and while we are not blocking it, we do not support this feature. Currently, there are no plans to include it in our product. However, if the number of requests for this feature increases, we will reevaluate our decision and consider incorporating it in the future. 
I suggest adding that idea to Ideas.

Kind Regards,
Jéssica M.

2024-06-25 12-03-33
Varuni Rajendran

Hi @Benjith Sam ,

I tried to implement your script in our project, but all search dropdown are being overridden . Is there any way to implement js so that it affects only in the place where it is been called? I have called the block in one one of our screen , but it is reflected in all other screens of our project.


Regards,

Varuni R

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.