File upload in codeigniter using ajax

问题

I am trying to upload file using ajax in codeigniter framework. My code work without using ajax but when i use ajax i got error message 'Undefined index: picture'in if($_FILES['picture']['name']).

Please check this code

View :

<form enctype="multipart/form-data" method="post">
   <div class="form-group">
      <label for="int">Picture</label>
      <input type="file" id="picture" name="picture" class="dropify" data-height="300" />
   </div>
</form>

AJAX :

var picture=new FormData( $("#picture")[0] );
var url = "<?php echo site_url('Workscontroller/create_action'); ?>";  
            $.ajax({
              url:url,
              data: {"title":title,"caption":caption,"description":description,"kategori":kategori,"picture":picture},
              dataType:"JSON",
              type:"POST",
              mimeType: "multipart/form-data",
              contentType: false,  
              cache: false,  
              processData:false,  
              success:function(data){  
               swal("Berhasil ditambahkan!", "Anda berhasil menambahkan porto folio.", "success")
               window.location.replace(data.url);
           }  
       });

Controller :

$this->load->library('upload');
   $this->_rules();
    $nmfile = "file_".time(); //nama file saya beri nama langsung dan diikuti fungsi time
    $config['upload_path'] = './works/'; //path folder
    $config['allowed_types'] = 'gif|jpg|png|jpeg|bmp'; //type yang dapat diakses bisa anda sesuaikan
    $config['max_size'] = '2048'; //maksimum besar file 2M
    $config['max_width']  = '2000'; //lebar maksimum 1288 px
    $config['max_height']  = '2000'; //tinggi maksimu 768 px
    $config['file_name'] = $nmfile; //nama yang terupload nantinya
    $this->upload->initialize($config);
    if($_FILES['picture']['name'])
    {
        if ($this->upload->do_upload('picture'))
        {
           $gbr = $this->upload->data();
           $data = array(
              'title' => $this->input->post('title',TRUE),
              'caption' => $this->input->post('caption',TRUE),
              'description' => $this->input->post('description',TRUE),
              'picture' => $gbr['file_name'],
              'kategori' => $this->input->post('kategori',TRUE),
              );
           $this->WorksModel->insert($data);
       }
   }
   else{

   }

回答1:

The argument to formData should be an HTML <form> element. That is most easily done by giving the <form> an id attribute.

view:

<form enctype="multipart/form-data" method="post" id='myForm'>

The ajax then changes to

var formData = new FormData($("#myForm")[0]);

In the javascript you don't show how the values for title, caption, description, and kategori are set. But they are clearly other <input> elements in the form. You probably do not need to capture these values separately because all form inputs (including FILE type inputs) are captured in var formData. That means that the ajax data option can be rewritten from

data: {"title":title,"caption":caption,"description":description,"kategori":kategori,"picture":picture},

data: formData,

The line if($_FILES['picture']['name']) should work now.

回答2:

//update like this

var url = "";
$.ajax({ url:url, data:"title":title,"caption":caption,"description":description,"kategori":kategori,"picture":picture}, dataType:"JSON", type:"POST", mimeType: "multipart/form-data", contentType: false,
async: false, cache: false, contentType: false, processData: false,
success:function(data){
swal("Berhasil ditambahkan!", "Anda berhasil menambahkan porto folio.", "success") window.location.replace(data.url); }
});

来源：https://stackoverflow.com/questions/46521560/file-upload-in-codeigniter-using-ajax

标签

php

ajax

codeigniter

file-upload

codeigniter-3