May 7, 2020

How to display set decimals for a number field in lightining:dataTable in Salesforce?

Sample Code:

Component:

<aura:component implements="force:appHostable"   
                controller="AccountListController">   
       
    <aura:attribute type="Account[]" name="acctList"/>   
    <aura:attribute name="mycolumns" type="List"/>   
       
    <aura:handler name="init" value="{!this}" action="{!c.fetchAccounts}"/>   
       
    <lightning:datatable data="{! v.acctList }"    
                         columns="{! v.mycolumns }"    
                         keyField="id"   
                         hideCheckboxColumn="true"/>   
       
</aura:component>


Component JavsScript Controller:

({   
       
    fetchAccounts : function(component, event, helper) {   
           
        component.set('v.mycolumns', [   
            {label: 'Account Name', fieldName: 'Name', type: 'text'},   
            {label: 'Created Date', fieldName: 'CreatedDate', type: 'date', typeAttributes: { 
                                                                            day: 'numeric', 
                                                                            month: 'short', 
                                                                            year: 'numeric', 
                                                                            hour: '2-digit', 
                                                                            minute: '2-digit', 
                                                                            second: '2-digit', 
                                                                            hour12: true}}, 
            {label: 'Annual Revenue', fieldName: 'AnnualRevenue', type: 'number', typeAttributes: {
                                                                                   minimumFractionDigits: 3,
                                                                                   maximumFractionDigits: 5}}
        ]);   
        var action = component.get("c.fetchAccts");   
        action.setParams({   
        });   
        action.setCallback(this, function(response) {   
               
            var state = response.getState();   
            if (state === "SUCCESS")    
                component.set("v.acctList", response.getReturnValue());               
               
        });   
        $A.enqueueAction(action);   
           
    }   
       
})


Apex Class:

public class AccountListController { 
     
    @AuraEnabled 
    public static List < Account > fetchAccts() { 
         
        return [ SELECT Id, Name, CreatedDate, AnnualRevenue FROM Account LIMIT 10 ]; 
         
    } 
     
}

Output:


No comments:

Post a Comment