2016-07-07 120 views
0

我一直在這個問題上停留了一段時間,並決定尋求幫助。這似乎不是一個應該讓我非常沮喪的問題,但我無法弄清楚這一點。CodeIgniter AJAX文件上傳接收錯誤

我想從使用CodeIgniter和AJAX的窗體上傳文件。任何建議都會很棒。謝謝!

查看:

<form method='post' enctype='multipart/form-data'> 
    <label>Name</label> 
    <input type='text' id='ImageName' class='form-control' /><br /> 
    <label>Image</label> 
    <input type='file' name='userfile' id='userfile' /> 
    <button type='button' class='btn btn-success extend-btn' id='UploadSaveButton'>Add Materials</button> 
</form> 

JS

$(document.body).on('click', '#UploadSaveButton', function(){ 
    var Name = $("#ImageName").val(); 
    var Image = new FormData($("#userfile").val()); 
    $.ajax({ 
     url: '/Store/SaveImage', 
     type: 'POST', 
     processData: false, 
     contentType: false, 
     fileElementId: 'userfile', 
     dataType: 'json', 
     data: {Name:Name, Image:Image}, 
     success:function(response){ 
      var data = JSON.parse(response); 
      if(data && data.error_message && data.error_message!="") { 
       $("#UploadError").html(data.error_message); 
      } else { 
       //success 
      } 
     }, 
     error:function(){ 
      $("#UploadError").html("An error occured. Try again later."); 
     } 
    }); 
}); 

控制器

public function SaveImage() 
{ 
    $config['upload_path'] = base_url().'uploads/PrimaryImages/'; 
    $config['allowed_types'] = 'jpeg|jpg|png'; 
    $config['max_size']  = 1024; 
    $config['max_width']  = 5000; 
    $config['max_height'] = 5000; 
    $this->load->library('upload', $config); 

    if(!$this->upload->do_upload('userfile')) { 
     $data = array(
      'error_message' => $this->upload->display_errors() 
     ); 
    } else { 
     $data['upload_data'] = $this->upload->data(); 
    } 
    $this->output->set_output(json_encode ($data)); 
} 

不管我做什麼,JSON響應始終是「您沒有選擇要上傳的文件。 「

回答

2

保持它很簡單:

上傳表單:

<form class="ui form" method="post" id="uploadForm" enctype="multipart/form-data"> 
     <div class="ui form"> 
      <div class="field required "> 
      <label>Bonus Amount</label> 
      <input name="userfile" id="userfile" placeholder="Bonus Amount" type="file" ></div> 
      <button name="action" class="ui button" id="upload" value="Upload">Upload Image</button> 
    </div> 
</form> 

你的Ajax:

<script > 
    $(document).ready(function(e) { 
    $('#upload').on('click' , function() { 
     $.ajax({ 
     url : '<?php echo base_url().'admin/uploadImage' ?>', 
     type : 'post', 
     data: $('#uploadForm').serialize(), 
     success : function(response) { 
      console.log(response); 
     } 
    });}); 
}); 
</script> 

控制器:

public function uploadImage() { 

    if($this->input->post('action') == 'Upload') { 
     $data = array(); 
     $config['upload_path'] = APPPATH.'uploads'.DIRECTORY_SEPARATOR; 
     $config['allowed_types'] = '*'; 
     $config['max_size']  = 1024; 
     $config['max_width']  = 5000; 
     $config['max_height'] = 5000; 
     print_r($config); 
     $this->load->library('upload', $config); 
     if(!$this->upload->do_upload('userfile')) { 
      $data = array('error_message' => $this->upload->display_errors()); 
     } else { 
      $data['upload_data'] = $this->upload->data(); 
     } 
     print_r($data); 
     die; 
    } 

}

+0

你好@pradeepp,我很欣賞時間和精力,但我無法讓這段代碼工作。經過進一步的研究,我發現無法使用iFrame在AJAX調用中發送圖像。我真的不相信這一點,而且我確信它已經離開了。無論如何,沒有用,我導致了一個插件。 [http://filer.grandesign.md/](http://filer.grandesign.md/)+1雖然。 – Jwags

0

經過進一步的研究,我發現,圖像無法翻過一個AJAX調用,而無需使用的iFrame發送。我真的不相信,我確信有一種方法。無論如何,沒有用,我導致了一個插件。 http://filer.grandesign.md/