[FIXED] How to upload multiple files using codeigniter and vue js

Issue

I think codeigniter $this->upload->do_upload('file') uploading all my files at once. I'm trying to upload multiple files, all are being uploaded but all my files are renamed in one name.

Example: I upload files name 1.png, 2.png, 3.png, 4.png after I upload my file all of the are renamed to 1.png.

<input type="file" ref="file" class="form-control validator" autocomplete="off" :class="{'is-invalid': formValidate.file}" name="files[]" id="files" multiple>

Here is my vue js code:

let formData = new FormData();
formData.append('csrf_token', csrf);
this.isUploading = true;
for( var i = 0; i < this.$refs.file.files.length; i++ ){
    let file = this.$refs.file.files[i];
    formData.append('files[]', file);
}
axios.post(base_url + 'Main/Process/FilesStorage/addFiles', formData, 
{
    headers: {
         'Content-Type': 'multipart/form-data'
     },
onUploadProgress: function(progressEvent) {
  this.uploadPercentage = Math.round((progressEvent.loaded * 100) /               progressEvent.total);
}.bind(this)
}).then(function(){

    }).catch(function(){

 })

My codeigniter code:

public function addFiles(){
            if($this->session->userdata('user_id') === NULL) {
                redirect(base_url().'Auth/Logout');
            }
            
            $data = [];
   
            $count = count($_FILES['files']['name']);
            $count;
            
            for($i=0;$i<$count;$i++){
            
                if(!empty($_FILES['files']['name'][$i])){
            
                    $_FILES['file']['name'] = $_FILES['files']['name'][$i];
                    $_FILES['file']['type'] = $_FILES['files']['type'][$i];
                    $_FILES['file']['tmp_name'] = $_FILES['files']['tmp_name'][$i];
                    $_FILES['file']['error'] = $_FILES['files']['error'][$i];
                    $_FILES['file']['size'] = $_FILES['files']['size'][$i];
            
                    $config['upload_path'] = PROOT.'storage/';
                    $config['allowed_types'] = '*';
                    $config['max_size'] = '15000';
                    $config['file_name'] = $_FILES['files']['name'][$i];
                    $this->load->library('upload', $config);
                    
                    if($this->upload->do_upload('file')){
                        $uploadData = $this->upload->data();
                        $filename = $uploadData['file_name'];
                        
                        $data['totalFiles'][] = $filename;
                    }else{
                        echo $this->upload->display_errors();
                    }
                }
            }
        }

Solution

Just simply remove $config['file_name'] = $_FILES['files']['name'][$i]; and it will fix your issue.

Answered By - user8718268