Unable to invoke Apex method from lightning component

Question

I'm trying to upload multiple attachments. First I'm getting attachments from user interface, then I'm converting them into JSON , then I need to make a server call. In this I'm using FileReader.

({
    saveFiles : function(component, event)
    {
        component.set("v.showLoadingSpinner", true);
        var files = component.find("fileId").get("v.files");
        var fileDetails = {};
        fileDetails.parentId = component.get("v.parentId");
        fileDetails.files = [];
        console.log('component..!',component);
        for(var i = 0; i < files.length; i++)
        {
            (function(file,idx,len) {
                console.log(idx+'--'+len);
                var name = file.name;
                var reader = new FileReader(); 
                reader.fName = files[i]['name'];
                reader.fType = files[i]['type'];
                reader.i = i;
                reader.onload = function(e) {
                    var fileContents = reader.result;
                    var base64 = 'base64,';
                    var dataStart = fileContents.indexOf(base64) + base64.length;
                    fileContents = fileContents.substring(dataStart);
                    var startPosition = 0;
                    var endPosition = Math.min(fileContents.length, startPosition + 750000);
                    var getchunk = fileContents.substring(startPosition, endPosition);
                    var fDetails = {};
                    fDetails.fileName = reader.fName;
                    fDetails.base64Data = encodeURIComponent(getchunk);
                    fDetails.contentType = reader.fType;
                    fileDetails.files.push(fDetails);

                    if(idx == len-1)
                    {
                        console.log('fileDetails..!',fileDetails);
                        var actSave = component.get("c.saveFilesData");
                        actSave.setParams({
                            "fileWrap": 'fileDetails'
                        });
                        actSave.setCallback(this, function(response) {
                            var state = response.getState();
                            console.log(response.getReturnValue());
                        });
                        $A.enqueueAction(actSave);
                    }
                }
                reader.readAsDataURL(file);
            })(files[i],i,files.length);
        }
    }
})

Above method is in helper.js. When user try to save attachments, above method will invoke.

I put a console log in callback. It is not invoking.

Answer 1

I had a similar problem here. you probably need the same solution:

execute your onload function from $A.getCallback:

reader.onload = $A.getCallback(function() {