cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Malasri
Regular Visitor

How to show tooltip on text field in the Entity List by retrieving another text field of the record In Power Portal?

I am having a case view entity list. In the case record there is a description field. In the view column Issue Summary single line of text field appears in the list. So when we hover on the Issue summary text, need to show the popup with description field value.

Malasri_1-1649141872824.png

 

On hover of this field, I need to retrieve description value and show.

1 ACCEPTED SOLUTION

Accepted Solutions
OliverRodrigues
Super User
Super User

Hi, I can think of two options of achieving this, both require JS:

 

  1. Retrieve the description via API/Fetch, and inject the value as tooltip in the summary field (it can slow down the page) - you can see API documentation for more info: Portals read operations using the Web API - Power Apps | Microsoft Docs
  2. Add the description as a new column, and hide it via JS, then use it to inject as tooltip into the summary field (better performance, but just for a millisecond, the users might see the description field in the view) - I wrote an article a while ago on how to hide a list column: Power Apps Portals – JavaScript Tip #01 – Hide & Show Elements – Oliver Rodrigues (oliverrodrigues36...

 

regardless of how you get the value, you will need JS to inject it to the summary column, I have a list with Accounts and will write a simple example retrieving the "Phone" field, and inject as tooltip into the primary contact:

OliverRodrigues_0-1649153887142.png

 

 

$(document).ready(function(){
    SetTooltip();
});

SetTooltip = function () {
 
    var list = $(".entitylist.entity-grid").eq(0);
 
    list.on("loaded", function () {
        list.find("table tbody > tr").each(function (index, tr) {
            var tooltipText = $(tr).find("td[data-attribute=telephone1]").text()
            $(tr).find("td[data-attribute=primarycontactid]").attr("title",tooltipText)
        });
    });
};



If you like this post, give a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users find it.

Power Pages Super User | MVP


Oliver Rodrigues


 

View solution in original post

4 REPLIES 4
OliverRodrigues
Super User
Super User

Hi, I can think of two options of achieving this, both require JS:

 

  1. Retrieve the description via API/Fetch, and inject the value as tooltip in the summary field (it can slow down the page) - you can see API documentation for more info: Portals read operations using the Web API - Power Apps | Microsoft Docs
  2. Add the description as a new column, and hide it via JS, then use it to inject as tooltip into the summary field (better performance, but just for a millisecond, the users might see the description field in the view) - I wrote an article a while ago on how to hide a list column: Power Apps Portals – JavaScript Tip #01 – Hide & Show Elements – Oliver Rodrigues (oliverrodrigues36...

 

regardless of how you get the value, you will need JS to inject it to the summary column, I have a list with Accounts and will write a simple example retrieving the "Phone" field, and inject as tooltip into the primary contact:

OliverRodrigues_0-1649153887142.png

 

 

$(document).ready(function(){
    SetTooltip();
});

SetTooltip = function () {
 
    var list = $(".entitylist.entity-grid").eq(0);
 
    list.on("loaded", function () {
        list.find("table tbody > tr").each(function (index, tr) {
            var tooltipText = $(tr).find("td[data-attribute=telephone1]").text()
            $(tr).find("td[data-attribute=primarycontactid]").attr("title",tooltipText)
        });
    });
};



If you like this post, give a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users find it.

Power Pages Super User | MVP


Oliver Rodrigues


 

Malasri
Regular Visitor

If we are multiple views, Hiding column and setting tooltip is working in default view. what to be done for other views.

OliverRodrigues
Super User
Super User

hi @Malasri I just did a test myself and it worked for both views. Can you share your code + snapshots? 




If you like this post, give a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users find it.

Power Pages Super User | MVP


Oliver Rodrigues


 

Malasri
Regular Visitor

Thanks!!!!! It is working fine

Helpful resources

Announcements
Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Difinity Conference 2022

Difinity Conference 2022

Register today for two amazing days of learning, featuring intensive learning sessions across multiple tracks, led by engaging and dynamic experts.

European SharePoint Conference

European SharePoint Conference

The European SharePoint Conference returns live and in-person November 28-December 1 with 4 Microsoft Keynotes, 9 Tutorials, and 120 Sessions.

Users online (2,547)