0

How can I get additional records by lightning datatable enableInfiniteLoading? I wanna get more 10 records when scroll lightning datatable, but the datatable shows only first 10 records when scroll down.(can get same 10 records)

How can I improve my code?

component

<lightning:datatable keyField="id"
                     data="{!v.data}"
                     columns="{!v.columns}"
                     enableInfiniteLoading="true"
                     onloadmore="{!c.loadMoreData}"/>

controller.js

({
doInit : function(component, event, helper) {
        component.set("v.columns", [
            {label:"product code",fieldName:"Name", type:"text"}
},
loadMoreData: function (component, event, helper) {
        event.getSource().set("v.isLoading", true);
        component.set("v.loadMoreStatus", "Loading");
        helper.getMoreData(component, event, component.get("v.data").length);
}
})

helper.js

({
    getMoreData : function(component, event, offSetCount){
        var getRecords = component.get("c.getRecords");
        getRecords.setParams({
            "Limits":component.get("v.limit"),
            "intOffSet":offSetCount
        });
        console.log(component.get("v.limit"));
        console.log(offSetCount);
        getRecords.setCallback(this, function(response){
            component.set("v.data",response.getReturnValue());
            event.getSource().set("v.isLoading", false);
        });
        $A.enqueueAction(getRecords);
    }
})

Apex

public class lookUpSearch {
@AuraEnabled
    public static List<EMITEM__c> getRecords(Integer Limits, Integer intOffSet) {
        System.debug(Integer.valueOf(Limits));
        System.debug(Integer.valueOf(Limits));
        return [SELECT Name
                FROM EMITEM__c
                ORDER BY Name ASC
                LIMIT :Integer.valueOf(Limits)
                OFFSET :Integer.valueOf(intOffSet)];
    }
}
1

what i found in your code,you binding the fresh data only by replacing existing data, it shouldn't, you should concat the fresh data in to existing data. Infiniterowloading

helper.js

({
getMoreData : function(component, event, offSetCount){

    var getRecords = component.get("c.getRecords");

    getRecords.setParams({
        "Limits":component.get("v.limit"),
        "intOffSet":offSetCount
    });
    console.log(component.get("v.limit"));
    console.log(offSetCount);
    getRecords.setCallback(this, function(response){
        var currentData = component.get("v.data"),
            newData = currentData.concat(response.getReturnValue());
        component.set("v.data",newData);
        event.getSource().set("v.isLoading", false);
    });
    $A.enqueueAction(getRecords);
}
})

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.