+ Start a Discussion
Russell Farmer 9Russell Farmer 9 

$A.get('e.force:refreshView').fire() isn't refreshing my datatable

I am trying to get a datatable to reload after it saves. All of my code is working correctly and the I have added console.logs to my reloadDataTable function so I know it is going through the code. However, it is not refresshing the component.
Here is my screen: 
User-added image

Here is my code:
Class
public class RFPDateController{

    @AuraEnabled
    public static List <Work_Date__c> fetchDates(String oppId) {
        //Qyery 10 
        List<Work_Date__c> dateList = [SELECT ID, Name, Date_Type__c, Work_Date__c, Opportunity_Related__c from Work_Date__c where Opportunity_Related__c != null and Opportunity_Related__c =: oppId];
        //return lis
        return dateList;
    }
    
        @AuraEnabled
    public static boolean updateDates(List<Work_Date__c> editedDatesList){
        try{
            update editedDatesList;
            return true;
        } catch(Exception e){
            return false;
        }
    }
}
Component
<aura:component controller="RFPDateController" access="global" implements="force:appHostable,flexipage:availableForAllPageTypes,force:hasRecordId">

    <aura:attribute type="Work_Date__c[]" name="dateList"/>
    <aura:attribute name="mycolumns" type="List"/>
    <aura:attribute name="updatedRecord" type="Object[]" />
     
    <aura:handler name="init" value="{!this}" action="{!c.fetchDTS}"/>
     
    <lightning:datatable aura:id="datesDataTable"
                         data="{! v.dateList }"
                         columns="{! v.mycolumns }"
                         keyField="Id"
                         hideCheckboxColumn="true"
                         onsave ="{!c.onSave}"
                         />
     
</aura:component>

Controller
({
    fetchDTS : function(component, event, helper) {
        helper.fetchDTSHelper(component, event, helper);    

    },
     /*
     * This function is calling saveDataTable helper function
     * to save modified records
     * */
    onSave : function (component, event, helper) {
        helper.saveDataTable(component, event, helper);
    }
})

Helper: This has my save function and the reload code. 
({
    fetchDTSHelper : function(component, event, helper) {
        component.set('v.mycolumns', [
            {label: 'Date Type', fieldName: 'Date_Type__c', editable:'true', sortable:'true', type: 'text'},
            {label: 'Date Name', fieldName: 'Name', editable:'true', sortable:'true', type: 'text'},            
            {label: 'Complete Date', fieldName: 'Work_Date__c', editable:'true', sortable:'true', type: 'date'}   
            ]);
        var action = component.get("c.fetchDates");
        console.log(component.get("v.dateList"));
        var operID = component.get("v.recordId");
        console.log("operID" + operID);
        action.setParams({
            oppId:operID
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                component.set("v.dateList", response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
        /*
     * This function get called when user clicks on Save button
     * user can get all modified records
     * and pass them back to server side controller
     * */
    saveDataTable : function(component, event, helper) {
        var editedRecords =  component.find("datesDataTable").get("v.draftValues");      
        var totalRecordEdited = editedRecords.length;
        var action = component.get("c.updateDates");
        action.setParams({
            'editedDatesList' : editedRecords
        });     
        action.setCallback(this,function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                //if update is successful
                if(response.getReturnValue() === true){
                    helper.showToast({
                        "title": "Record Update",
                        "type": "success",
                        "message": totalRecordEdited+" Account Records Updated"
                    });
                    helper.reloadDataTable();

                } else{ //if update failed
                    helper.showToast({
                        "title": "Error!!",
                        "type": "error",
                        "message": "Error in update"
                    });
                }
            }
        });
        $A.enqueueAction(action);
    },
    /*
     * Show toast with provided params
     * */
    showToast : function(params){
        var toastEvent = $A.get("e.force:showToast");
        if(toastEvent){
            toastEvent.setParams(params);
            toastEvent.fire();
        } else{
            alert(params.message);
        }
    },

    /*
     * reload data table
     * */
    reloadDataTable : function(){
    var refreshEvent = $A.get("e.force:refreshView");
        console.log("reload1");
        if(refreshEvent){
            console.log("reload2");
            refreshEvent.fire();
            console.log("reload3");
        }
    },
})

Credit where due: I'm using code I foudn here: https://sfdcfacts.com/lightning/editable-lightningdatatable-summer18-feature/
 
Best Answer chosen by Russell Farmer 9
Russell Farmer 9Russell Farmer 9
I was able to get this to work by using this:
/*
     * This function is calling saveDataTable helper function
     * to save modified records
     * */
    onSave : function (component, event, helper) {
        helper.saveDataTable(component, event, helper);
        console.log("It Fired!");
     /*
     * This part reloads the component by recall fetchDTS
     * */
        var a = component.get('c.fetchDTS');
    	$A.enqueueAction(a);

Seems a bit hacky to recall the first function but it works.
Does anyone know why 'e.force:refreshView' doesn't wokr?

All Answers

Russell Farmer 9Russell Farmer 9
I was able to get this to work by using this:
/*
     * This function is calling saveDataTable helper function
     * to save modified records
     * */
    onSave : function (component, event, helper) {
        helper.saveDataTable(component, event, helper);
        console.log("It Fired!");
     /*
     * This part reloads the component by recall fetchDTS
     * */
        var a = component.get('c.fetchDTS');
    	$A.enqueueAction(a);

Seems a bit hacky to recall the first function but it works.
Does anyone know why 'e.force:refreshView' doesn't wokr?
This was selected as the best answer
Ash Sehgal 3Ash Sehgal 3
Great solution to refresh the component!