enter image description here

I'm trying to add a tooltip as showsn in the picture above. But I don't see anything out of the box that comes with the lightning:datatable that would help us do it,

Any ideas on how to get this tool tip added to the header column.

Component code

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >

<aura:attribute name="mydata" type="Object"/>
<aura:attribute name="mycolumns" type="List"/>
<aura:handler name="init" value="{! this }" action="{! c.init }"/>
<lightning:datatable data="{! v.mydata }" 
    columns="{! v.mycolumns }" 
    keyField="id" />


Controller code

  init: function (cmp, event, helper) {

cmp.set('v.mycolumns', [
            {label: 'Opportunity name', fieldName: 'opportunityName', type: 'text'},
            {label: 'Confidence', fieldName: 'confidence', type: 'percent', cellAttributes:
             { iconName: { fieldName: 'trendic' }, iconPosition: 'right' }},
            {label: 'Amount', fieldName: 'amount', type: 'currency', typeAttributes: { currencyCode: 'EUR'}},
            {label: 'Contact Email', fieldName: 'contact', type: 'email'},
            {label: 'Contact Phone', fieldName: 'phone', type: 'phone'}

    cmp.set('v.mydata', [{
            id: 'a',
            opportunityName: 'Cloudhub',
            confidence: 0.2,
            amount: 25000,
            contact: 'jrogers@cloudhub.com',
            phone: '2352235235',

            id: 'b',
            opportunityName: 'Quip',
            confidence: 0.78,
            amount: 740000,
            contact: 'quipy@quip.com',
            phone: '2352235235',

}, })
  • 1
    I don't think it is possible - it is not documented and I have also tried to add typeAttributes: { title: 'itai test'} to a column and it is not working – Itai Shmida Jan 18 '18 at 12:48
  • 1
    @ItaiShmida thanks I didn't find anything too. Wish Salesforce could provide a lot more features in this component as it's going to be very widely used. – SFG Jan 18 '18 at 19:59

I'm trying to figure out this same thing.

I have discovered that if you use the following, you can get the icon to appear in the header only instead of every cell.

{label:'MyLabel', fieldName:'myfield', iconName:'utility:info'}

Note: iconName is a param on the column, not within cellAttributes.

I'm still trying to add helptext and will update if I figure out how.

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.