1

How can to Implement Tool Tip in Lightning Data Table:

Lightning Data Table:

        <lightning:datatable
                         keyField="Id"
                         aura:id="dataTable"
                         data="{! v.data }"
                         columns="{! v.columns }"
                         hideCheckboxColumn="true"
                         showRowNumberColumn="false"
                         initialRows="{! v.recordsToDisplay}"
                         sortedBy="{! v.sortedBy }"
                         sortedDirection="{! v.sortedDirection }"
                         defaultSortDirection="{!v.defaultSortDirection}"
                         onsort="{! c.updateColumnSorting}"
                         onrowaction="{! c.handleRowAction }"
                         />

Js side:

   component.set('v.columns', [{
            label: 'Primary ID',
            fieldName: 'PrimaryId__c',
            type: 'text',
            sortable: true
        },
         {
            label: 'Primary ID Type',
            fieldName:'PrimaryIdType__c',
            type: 'text',
            sortable: true
        }
         ]);

Following columns:

cloumn 1:Primary ID , column 2: Primary ID Type

Showing cell values in the Image:

enter image description here

How to display My Tool tips Like below in Lightning data table Like below:

In tool tip needs to display Like below:

 Email : test@test.com   (hovering test@test.com- cell1)
 NucleusId : 566         (hovering on NucleusId - cell2)

I have refereed this post:

https://success.salesforce.com/ideaView?id=0873A0000003fVOQAY

1

This is not possible in standard Lightning Data Table as it supports tooltip only for URL type fields.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.