+ Start a Discussion
.12.12 

column sorting in lightning datatable getting data.sort is not a function don't know where i missed

User-added image
 I was getting the above error while i was trying to sort the data in datatable 

Component
:

<aura:component controller="DataController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickActionWithoutHeader,lightning:availableForFlowScreens" access="global" >         
    
   <aura:attribute type="sobject" name="acctList"/>
    <aura:attribute name="mycolumns" type="List"/>
    <aura:attribute name="sortedBy" type="String" default="Name"/>
    <aura:attribute name="sortedDirection" type="String" default="asc"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.fetchAccounts}"/>
    
    <lightning:datatable data="{!v.acctList.stocks}" 
                         columns="{!v.mycolumns}" 
                         keyField="id"
                         hideCheckboxColumn="true"
                         onsort="{!c.updateColumnSorting}"
                         sortedBy="{!v.sortedBy}"  
                         sortedDirection="{!v.sortedDirection}"/>
</aura:component>

Controller:

({
    fetchAccounts : function(component, event, helper) {
        component.set('v.mycolumns', [ {label: 'Stock Name', fieldName: 'stockName', type: 'text', sortable: true},
{label: 'Stock', fieldName: 'stock', type: 'text', sortable: true},
{label: 'Total Share', fieldName: 'totalShare', type: 'text', sortable: true}
]);
        var action = component.get("c.dataFetch");
        action.setParams({
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                component.set("v.acctList", response.getReturnValue());
                helper.sortData(component, component.get("v.sortedBy"), component.get("v.sortedDirection"));
            }
        });
        $A.enqueueAction(action);
    },
    updateColumnSorting: function (cmp, event, helper) {
        var fieldName = event.getParam('fieldName');
        var sortDirection = event.getParam('sortDirection');
        cmp.set("v.sortedBy", fieldName);
        cmp.set("v.sortedDirection", sortDirection);
        helper.sortData(cmp, fieldName, sortDirection);
    }
})


Helper:

({
    sortData: function (cmp, fieldName, sortDirection) {
        var data = cmp.get("v.acctList");
        var reverse = sortDirection !== 'asc';
        data.sort(this.sortBy(fieldName, reverse));
        cmp.set("v.acctList", data);
    },
    sortBy: function (field, reverse, primer) {
        var key = primer ?
            function(x) {return primer(x[field])} :
            function(x) {return x[field]};
        reverse = !reverse ? 1 : -1;
        return function (a, b) {
            return a = key(a), b = key(b), reverse * ((a > b) - (b > a));
        }
    }
})

Apex:
public class DataController {
@AuraEnabled
    public static DataWrapper dataFetch(){
        try{
            String json = '{\"accountName\": \"RAM REDDY\",\"registrationId\": \"501049438\",\"accountType\": \"Savings\",\"openDate\": \"08/24/2021\",\"allowedTransactions\": [\"Send\",\"Recieve\",\"Manage\"],\"address\": {\"addressLine1\": \"\",\"addressLine2\": \"\",\"addressLine3\": \"\"},\"stocks\": [{\"stock\": \"BTC\",\"stockName\": \"Bitcoin\",\"stockNumber\": \"051\",\"accountNumber\": \"12000012653\",\"currentValue\": \"161293.80\",\"totalShare\": \"5367.514\",      \"totalCost\": \"134931.56089999998\",\"minimumInvestment\": \"200.000000000000\"},{\"stock\": \"LTC\",\"stockName\": \"Litecoin\",\"stockNumber\": \"052\",\"accountNumber\": \"3338493\",\"currentValue\": \"324.80\",\"totalShare\": \"545.514\",      \"totalCost\": \"2242.56089999998\",\"minimumInvestment\": \"50.000000000000\"}],\"accountClosedStatus\": false,\"totalCurrentValue\": 170790.31}';
            DataWrapper  responseWrapper = DataWrapper.parse(json);
            return responseWrapper;
        } catch(Exception ex){
            System.debug('Error occured while fetching the documents list' + ex);
        }
        return null;
    }

Wrapper:
//
// Generated by JSON2Apex http://json2apex.herokuapp.com/
//

public class DataWrapper {
    
    @AuraEnabled
    public String accountName;
    @AuraEnabled
    public String registrationId;
    @AuraEnabled
    public String accountType;
    @AuraEnabled
    public String openDate;
    @AuraEnabled
    public List<String> allowedTransactions;
    @AuraEnabled
    public Address address;
    @AuraEnabled
    public List<Stocks> stocks;
    @AuraEnabled
    public Boolean accountClosedStatus;
    @AuraEnabled
    public Double totalCurrentValue;

    public class Address {
        @AuraEnabled
        public String addressLine1;
        @AuraEnabled
        public String addressLine2;
        @AuraEnabled
        public String addressLine3;
    }

    public class Stocks {
        @AuraEnabled
        public String stock;
        @AuraEnabled
        public String stockName;
        @AuraEnabled
        public String stockNumber;
        @AuraEnabled
        public String accountNumber;
        @AuraEnabled
        public String currentValue;
        @AuraEnabled
        public String totalShare;
        @AuraEnabled
        public String totalCost;
        @AuraEnabled
        public String minimumInvestment;
    }

    
    public static DataWrapper parse(String json) {
        return (DataWrapper) System.JSON.deserialize(json, DataWrapper.class);
    }
}
Suraj Tripathi 47Suraj Tripathi 47
Hi .12,

Are you facing this error, when you click on Column Or when you load the Page?

  Thank you!
  Regards 
 Suraj Tripathi