Загрузка файла Ajax в Codeigniter

на моей странице просмотра есть несколько виджетов загрузки файлов, но для справки я добавил только 1-й здесь, что я хочу сделать, так это выбрать файл с помощью кнопки, а затем с помощью метода ajax я хочу загрузить файл в каталог и верните имя файла в поле ввода с именем «passport_copy_upload».

как это

все другие виджеты загрузки файлов на этой странице будут работать, и в конце мы отправим форму и перенаправим пользователя на страницу благодарности.

Проблема в следующем: файл не загружается в каталог, в сетевой консоли появляется ошибка: {"error":"Вы не выбрали файл для загрузки."}

Моя часть просмотра

        <form id="fimilyVisaForm" action="https://www.mydomainurl.com/visa/add-other-details/<?php echo $appid;?>" method="post" enctype="multipart/form-data" onsubmit="return(validate());">

                                <h4 class="row marginBottom">Upload Documents</h4>

                <div class="form-control">
                    <div class="col-sm-4 label">Colored Scanned copy of the Passport</div>
                    <div class="col-sm-3">
                       <input type="text" class="form-control-input" placeholder="Colored Scanned copy of the Passport" name="passport_copy_upload" id="passport_copy_upload" onclick="removeError(this.id);" value="">
                    </div>   
                    <div class="col-sm-3">   
                       <input type="button" class="submit-btn read-more" value="Attach" id="passport">
                       <input type="file" name="passportimg" id="passportimg" style="display:none">
                       <a id="viewct" class="submit-btn read-more" href="#">View</a>
                      <div class="labelInfo">Colored Scanned copy of the Passport</div>
                    </div>
                </div>
    </form>

<script>
  document.getElementById('passport').onclick = function() {
    document.getElementById('passportimg').click();
};
</script>

Javascript Ajax-код

<script>
$("#passportimg").change(function() {
    var file_data = $("#passportimg").prop("files")[0];
    var form_data = new FormData();
    form_data.append("file", file_data);
    $.ajax({
        url:'<?= base_url();?>index/do_upload',
        dataType: 'json',
        cache: false,
        async: false,
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success:function(data)  
                     {  
                          console.log(data);
                     } 
    });
});
</script>

это мой контроллер

    public function do_upload() { 
      header('Content-Type: application/json');

      $config['upload_path']   = '<?= base_url();?>uploads/applicant/'; 
      $config['allowed_types'] = 'gif|jpg|png|jpeg'; 
      $config['max_size']      = 2048;
      $this->load->library('upload', $config);
          $this->upload->initialize($config);

      if ( ! $this->upload->do_upload('passportimg')) {
         $error = array('error' => $this->upload->display_errors()); 
         echo json_encode($error);
      }else { 
         $data = $this->upload->data();
         $success = ['success'=>$data['file_name']];
         echo json_encode($success);
      } 
   }