画像がPHPコードネイターでアップロードされておらず、応答が得られません

Question

jqueryを使用してcodeigniterにファイルアップロードシステムを作成しています。しかし、私はこれにいくつかの問題を抱えています。私はファイル名を取得しています。しかし、なぜ私はそれがサーバー上のファイルをアップロードしていないのかわかりません。私に何か不足しているかどうか教えてください。

ボタン上の私のjQueryのコードは、クリックここで

var post_data = $('#post').val(); 
     if (!$('#post').val()) { 
      // console.log('hit'); 
      // alert($('input[type=file]').val()); 

     if (typeof FormData !== 'undefined') { 

     // send the formData 
     var formData = new FormData($("#formname")[0]); 

     $.ajax({ 
      url : 'Profile/uploadimg', // Controller URL 
      type : 'POST', 
      data : formData, 
      async : false, 
      cache : false, 
      contentType : false, 
      processData : false, 
      success : function(data) { 
       console.log(data); 
      } 
     }); 

    } else { 
     message("Your Browser Don't support FormData API! Use IE 10 or Above!"); 
    } 

は私のコントローラのコード

public function uploadimg() 
    { 
    $var = $_FILES ['fileUp']; 
    //print_r($var); 
    if($this->input->post('fileupload')) { 

    $config['upload_path'] = 'upload'; 
    $config['file_name'] = $var; 
    $config['overwrite'] = 'TRUE'; 
    $config["allowed_types"] = 'jpg|jpeg|png|gif'; 
    $config["max_size"] = '1024'; 
    $config["max_width"] = '400'; 
    $config["max_height"] = '400'; 
    $this->load->library('upload', $config); 

    if(!$this->upload->do_upload()) {    
     $this->data['error'] = $this->upload->display_errors(); 

     print_r('error'); 
    } else { 
     print_r("success");          
    } 

} 

私のHTMLフォーム

<form enctype="multipart/form-data" name="formname" id="formname" method="post" action=""> 
<div class="post-menu col-lg-7 col-sm-7 col-xs-12"> 
       <ul> 
       <li><a href="javascript:void(0)"><img src="<?php echo base_url(); ?>img/camera1.png" alt="Uplod photo" id="imgupload" ></a> 
       <input type="file" id="fileupload" name="fileUp" class="hidden" accept="image/*"> 
       </li> 
       <li><a href=""><img src="<?php echo base_url(); ?>img/add-peopel.png" alt="Add Friend" ></a></li> 
       <li><a href=""><img src="<?php echo base_url(); ?>img/add-location.png" alt="Location" ></a></li> 
       </ul> 
      </div> 
      <div class="post-right col-lg-5 col-sm-5 col-xs-12"> 
       <ul> 
       <li><a href="" class="slt"><img src="<?php echo base_url(); ?>img/frends.png" alt="friends"> Friends <img src="<?php echo base_url(); ?>img/arrow.png" alt="Droop Down"> </a></li> 
       <li><input type="button" class="bt1" value="Post" id="post_button"></li> 
       </ul> 
      </div> 
</form> 

Answer 1

試してみて、私に知らせてください。 あなたのAJAXリクエスト

$(document).on("submit",'#formname',function(event){ 
    var form = $('#formname').get(0); 
    var formData = new FormData(form); 
    $.ajax({ 
     type: "POST", 
     url: "<?php echo site_url("Profile/uploadimg"); ?>", 
     data: formData, 
     dataType: 'jSon', 
     xhr: function() { 
      var myXhr = $.ajaxSettings.xhr(); 
      return myXhr; 
     }, 
     cache:false,      
     contentType: false, 
     processData: false, 
     success: function(result){ 
     console.log(result); 
     }      
    }); 
    event.preventDefault(); 
}); 

とコントローラコード： -

public function uploadimg() 
{ 
    $var = $_FILES ['fileUp']; 
    $config['upload_path'] = 'upload'; 
    $config['overwrite'] = 'TRUE'; 
    $config["allowed_types"] = 'jpg|jpeg|png|gif'; 
    $config["max_size"] = '1024'; 
    $config["max_width"] = '400'; 
    $config["max_height"] = '400'; 
    $this->load->library('upload', $config); 

    if(!$this->upload->do_upload('fileUp')) 
    {    
     $this->data['error'] = $this->upload->display_errors(); 
     echo json_encode(array("result"=>$this->data['error'])); 
     exit; 
    } 
    else 
    { 
     echo json_encode(array("result"=>"Success")); 
     exit;         
    } 
} 

Answer 2

のようなあなたのAJAX呼び出しにmimeType:"multipart/form-data"を追加です：

$.ajax({ 
     url : 'Profile/uploadimg', // Controller URL 
     type : 'POST', 
     data : formData, 
     mimeType:"multipart/form-data", 
     async : false, 
     cache : false, 
     contentType : false, 
     processData : false, 
     success : function(data) { 
      console.log(data); 
     } 
    }); 

また、フォームタグの属性がenctype="multipart/form-data"であることを確認してください。

コメント行：$config['file_name'] = $var;。次のように あなたは（print_r("success");の上に追加します）アップロードされたファイルのデータを取得することができます。

$uploadFileData = $this->upload->data(); 
$uploadFileName = (isset($uploadFileData['file_name']) && trim($uploadFileData['file_name']))? $uploadFileData['file_name'] : '';