I'm trying to add button-icon column to my lightning:datatable, but it does not display any icon and simply a blank cell is rendered.

I fail to see what I might be doing wrong here. Can someone guide me a bit on this?

My sample code is as follows:


<aura:component controller="TableGridController" implements="flexipage:availableForAllPageTypes" access="global" >
    <aura:attribute name="dataList" type="Object" />
    <aura:attribute name="columnsList" type="List" />

    <aura:handler name="init" value="{! this }" action="{! c.init }" />

    <div class="slds-is-relative">
        <lightning:datatable    keyField="Id"
                                data="{! v.dataList }"
                                columns="{! v.columnsList }"
                                hideCheckboxColumn="true" />


    init: function (component, event, helper) {


    getContacts : function(component) {
        var action  = component.get("c.getContactsList");
            var result = response.getReturnValue();

            var columns = [
                    type: 'button-icon',
                    fixedWidth: 40,
                    typeAttributes: {
                        iconName: 'utility:edit',
                        name: 'edit_record', 
                        title: 'Edit',
                        variant: 'border-filled',
                        alternativeText: 'edit',
                        disabled: false
                    label: 'Name', 
                    fieldName: 'Name', 
                    type: 'text'
            component.set('v.columnsList', columns);
            component.set("v.dataList", result);

TableGridController APEX Class:

public with sharing class TableGridController {
    public static List<Contact> getContactsList() {
        return [select Id,Name from Contact limit 10];

The Output I've in Datagrid is like this: enter image description here


Silly me! https://developer.salesforce.com/docs/component-library/bundle/lightning:datatable/example

Is already updated to Winter '19 release, and this dataType for Columns is newly added in Winter '19 release, while my coding org is still on 'Summer '18` release.

The above code works fine in Winter '19 release org

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.