Skip to main content

({ save : function(component, event, helper) { var MAX_FILE_SIZE = 750000; var fileInput = component.find('file').getElement(); console.log('fileInput', fileInput); console.log('file', fileInput.files[0]); // this return file object var file1 = fileInput.files[0]; if(file1.size > MAX_FILE_SIZE) { console.log('File size exceeded the maximum upload limit.'); return false; }

({
  save : function(component, event, helper) {
        var MAX_FILE_SIZE = 750000;
        var fileInput = component.find('file').getElement();
        console.log('fileInput', fileInput); 
        console.log('file', fileInput.files[0]); // this return file object
        var file1 = fileInput.files[0];
        if(file1.size > MAX_FILE_SIZE) {
            console.log('File size exceeded the maximum upload limit.');
            return false;
        }

        var fr = new FileReader();
        var fileContents;
        var self = this;
        fr.onload = $A.getCallback(function(){
             fileContents = fr.result;
            var base64Mark = 'base64,';
            var dataStart = fileContents.indexOf(base64Mark) + base64Mark.length;
            fileContents = fileContents.substring(dataStart);
            fr.readAsDataURL(file1);
            
        });
      this.upload(component, file1, fileContents);
         // this doesn't work
    },
    upload: function(component, file, fileContents) {
        var fromPos = 0;
        var toPos = Math.min(fileContents.length, fromPos + this.CHUNK_SIZE);
        
        // start with the initial chunk
        this.uploadChunk(component, file, fileContents, fromPos, toPos, '');   
    },
    uploadChunk : function(component, file, fileContents, fromPos, toPos, attachId) {
        var action = component.get("c.saveTheChunk"); 
        var chunk = fileContents.substring(fromPos, toPos);

        action.setParams({
            parentId: component.get("v.parentId"),
            fileName: file.name,
            base64Data: encodeURIComponent(chunk), 
            contentType: file.type,
            fileId: attachId
        });
       
        var self = this;
        action.setCallback(this, function(a) {
            attachId = a.getReturnValue();
            
            fromPos = toPos;
            toPos = Math.min(fileContents.length, fromPos + self.CHUNK_SIZE);    
            if (fromPos < toPos) {
                self.uploadChunk(component, file, fileContents, fromPos, toPos, attachId);  
            }
        });
            
        $A.run(function() {
            $A.enqueueAction(action); 
        });
    }
})

})

({ save : function(component, event, helper) { var MAX_FILE_SIZE = 750000; var fileInput = component.find('file').getElement(); console.log('fileInput', fileInput); console.log('file', fileInput.files[0]); // this return file object var file1 = fileInput.files[0]; if(file1.size > MAX_FILE_SIZE) { console.log('File size exceeded the maximum upload limit.'); return false; }

    var fr = new FileReader();
    var fileContents;
    var self = this;
    fr.onload = $A.getCallback(function(){
         fileContents = fr.result;
        var base64Mark = 'base64,';
        var dataStart = fileContents.indexOf(base64Mark) + base64Mark.length;
        fileContents = fileContents.substring(dataStart);
        fr.readAsDataURL(file1);
        
    });
  this.upload(component, file1, fileContents);
     // this doesn't work
},
upload: function(component, file, fileContents) {
    var fromPos = 0;
    var toPos = Math.min(fileContents.length, fromPos + this.CHUNK_SIZE);
    
    // start with the initial chunk
    this.uploadChunk(component, file, fileContents, fromPos, toPos, '');   
},
uploadChunk : function(component, file, fileContents, fromPos, toPos, attachId) {
    var action = component.get("c.saveTheChunk"); 
    var chunk = fileContents.substring(fromPos, toPos);

    action.setParams({
        parentId: component.get("v.parentId"),
        fileName: file.name,
        base64Data: encodeURIComponent(chunk), 
        contentType: file.type,
        fileId: attachId
    });
   
    var self = this;
    action.setCallback(this, function(a) {
        attachId = a.getReturnValue();
        
        fromPos = toPos;
        toPos = Math.min(fileContents.length, fromPos + self.CHUNK_SIZE);    
        if (fromPos < toPos) {
            self.uploadChunk(component, file, fileContents, fromPos, toPos, attachId);  
        }
    });
        
    $A.run(function() {
        $A.enqueueAction(action); 
    });
}

})

({
  save : function(component, event, helper) {
        var MAX_FILE_SIZE = 750000;
        var fileInput = component.find('file').getElement();
        console.log('fileInput', fileInput); 
        console.log('file', fileInput.files[0]); // this return file object
        var file1 = fileInput.files[0];
        if(file1.size > MAX_FILE_SIZE) {
            console.log('File size exceeded the maximum upload limit.');
            return false;
        }

        var fr = new FileReader();
        var fileContents;
        var self = this;
        fr.onload = $A.getCallback(function(){
             fileContents = fr.result;
            var base64Mark = 'base64,';
            var dataStart = fileContents.indexOf(base64Mark) + base64Mark.length;
            fileContents = fileContents.substring(dataStart);
            fr.readAsDataURL(file1);
            
        });
      this.upload(component, file1, fileContents);
         // this doesn't work
    },
    upload: function(component, file, fileContents) {
        var fromPos = 0;
        var toPos = Math.min(fileContents.length, fromPos + this.CHUNK_SIZE);
        
        // start with the initial chunk
        this.uploadChunk(component, file, fileContents, fromPos, toPos, '');   
    },
    uploadChunk : function(component, file, fileContents, fromPos, toPos, attachId) {
        var action = component.get("c.saveTheChunk"); 
        var chunk = fileContents.substring(fromPos, toPos);

        action.setParams({
            parentId: component.get("v.parentId"),
            fileName: file.name,
            base64Data: encodeURIComponent(chunk), 
            contentType: file.type,
            fileId: attachId
        });
       
        var self = this;
        action.setCallback(this, function(a) {
            attachId = a.getReturnValue();
            
            fromPos = toPos;
            toPos = Math.min(fileContents.length, fromPos + self.CHUNK_SIZE);    
            if (fromPos < toPos) {
                self.uploadChunk(component, file, fileContents, fromPos, toPos, attachId);  
            }
        });
            
        $A.run(function() {
            $A.enqueueAction(action); 
        });
    }
})
Source Link

File Upload Component Lightning not working

I am creating a custom lightning file upload component.

Below is the component code

({ save : function(component, event, helper) { var MAX_FILE_SIZE = 750000; var fileInput = component.find('file').getElement(); console.log('fileInput', fileInput); console.log('file', fileInput.files[0]); // this return file object var file1 = fileInput.files[0]; if(file1.size > MAX_FILE_SIZE) { console.log('File size exceeded the maximum upload limit.'); return false; }

    var fr = new FileReader();
    var fileContents;
    var self = this;
    fr.onload = $A.getCallback(function(){
         fileContents = fr.result;
        var base64Mark = 'base64,';
        var dataStart = fileContents.indexOf(base64Mark) + base64Mark.length;
        fileContents = fileContents.substring(dataStart);
        fr.readAsDataURL(file1);
        
    });
  this.upload(component, file1, fileContents);
     // this doesn't work
},
upload: function(component, file, fileContents) {
    var fromPos = 0;
    var toPos = Math.min(fileContents.length, fromPos + this.CHUNK_SIZE);
    
    // start with the initial chunk
    this.uploadChunk(component, file, fileContents, fromPos, toPos, '');   
},
uploadChunk : function(component, file, fileContents, fromPos, toPos, attachId) {
    var action = component.get("c.saveTheChunk"); 
    var chunk = fileContents.substring(fromPos, toPos);

    action.setParams({
        parentId: component.get("v.parentId"),
        fileName: file.name,
        base64Data: encodeURIComponent(chunk), 
        contentType: file.type,
        fileId: attachId
    });
   
    var self = this;
    action.setCallback(this, function(a) {
        attachId = a.getReturnValue();
        
        fromPos = toPos;
        toPos = Math.min(fileContents.length, fromPos + self.CHUNK_SIZE);    
        if (fromPos < toPos) {
            self.uploadChunk(component, file, fileContents, fromPos, toPos, attachId);  
        }
    });
        
    $A.run(function() {
        $A.enqueueAction(action); 
    });
}

})

I am getting error:

this.upload is not a function.Not sure where I am making the mistake.