Codeigniter jqueryとajaxエラーを使用した画像アップロード

Question

次のクエリのガイダンスが必要です。
ファイルをアップロードしようとしましたが、ファイルを目的のディレクトリに移動しようとしましたが、失敗します。フォーム上では、input ['file']データ以外のすべてのフィールドデータがコントローラに渡されます。
次のコードを実行してください。

ビュー：フォームは、ブートストラップモーダルを使用して表示され
のみ最小限のコードを

<form method="post" action="<?php //echo base_url().'admin/students/update_accomodation'; ?>" id="accform" enctype="multipart/form-data"> 
     <div class="form-group"> 
      <div class="row"> 
        <div class="col-md-2"> 
         <label>Students</label> 
        </div> 
        <div class="col-md-4"> 
         <input type="text" name="student" value="" /> 
        </div> 
        <div class="col-md-2"> 
         <label>Room</label> 
        </div> 
        <div class="col-md-4"> 
         <input type="text" name="room" value="" /> 
        </div> 
      </div>  
     </div> 
     <div class="form-group"> 
      <div class="row"> 
        <div class="col-md-2"> 
         <label>Stay</label> 
        </div> 
        <div class="col-md-4"> 
         <select name="stay" class="form-control" id="stay"> 
          <option value="1">1 Month</option> 
          <option value="2">2 Month</option> 
          <option value="3">3 Month</option> 
          <option value="4">4 Month</option> 
          <option value="5">5 Month</option> 
          <option value="6">6 Month</option> 
          <option value="7">7 Month</option> 
          <option value="8">8 Month</option> 
          <option value="9">9 Month</option> 
          <option value="10">10 Month</option> 
          <option value="11">11 Month</option> 
          <option value="12">12 Month</option> 
          <option value="18">18 Month</option> 
          <option value="24">24 Month</option> 
          <option value="36">36 Month</option> 
         </select> 
        </div> 
        <div class="col-md-2"> 
         <label>Upload PDF</label> 
        </div> 
        <div class="col-md-4"> 
         <input type="file" name="file" id="file" class="btn btn-default btn-file" /> 
        </div> 
      </div> 
     </div> 
    <div class="modal-footer"> 
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
    <button type="submit" class="btn btn-primary accomodation">Submit</button> 
    </div> 
    </form> 

を掲載してAjaxの
、jquery.jsファイルがpefectlyロードされ、同じページにとフッターですファイルフィールドデータ以外のデータもコントローラに渡されます。私は取得していますどのようなエラー

<script> 
$(document).ready(function() { 
    $(".accomodation").click(function(event) { 
     event.preventDefault(); 
     //var formData = $('#accform').serialize(); 
     // var formData = new FormData($(this)[0]); 
     //var formData = $('#accform').formSerialize(); 
     //console.log(formData); 
     //alert(JSON.stringify(formData)); 
     $.ajax({ 
      type: "POST", 
      url: "<?php echo site_url('admin/students/update_accomodation'); ?>", 
      data: $('#accform').serialize(), 
      //data: new FormData($("#accform")[0]), 
      processData: false, 
      success: function(res) { 
       //var json = JSON.parse(res); 
       var parsed = res; 
       console.log(parsed); 
       if(parsed.status_code == 1) { 
        alert('data inserted successfully'); 
        window.location.href = "<?php echo site_url('admin/bookings'); ?>"; 
       }else { 
        alert(parsed.status); 
       } 
      } 

     }); 
    });  
}); 

コントローラ

function update_accomodation() { 
    //form input validation 
    $this->form_validation->set_rules('student_id','Student ID','trim|required'); 
    $this->form_validation->set_rules('room_id','Room ID','trim|required'); 
    $this->form_validation->set_rules('stay','stay','required'); 
    if (empty($_FILES['file']['name'])) {      //check file is selected 
     $this->form_validation->set_rules('file','File','required'); 
    } 
    if($this->form_validation->run() == FALSE) {    //form validation false 
     $data = array(
      'status' => validation_errors(), 
      'status_code' => 2 
     ); 
     echo json_encode($data); 
    } else {   
     //echo json_encode(array('data' => $_FILES['file']['name'])); 
     //form validation true 
     if (0 < $_FILES['file']['error']) { 
      $data = array(
       'status' => 'File uploading error', 
       'status_code' => 3 
      ); 
      echo json_encode($data); 
    } else { 
      $sourcePath = $_FILES['file']['tmp_name'];   //filename="file" 
      $targetPath = "uploads/students/contracts/".rand(0,10000).$_FILES['file']['name'];  //targetpath with random number as prefix 
      move_uploaded_file($sourcePath,$targetPath);        //move file to target folder 
      $data1 = array(           //take inputs 
       'stay' => $this->input->post('firstname'), 
       'id_upload' => $targetPath 
      ); 
      $data = array(
       'status' => 'upload successfully', 
       'status_code' => 1 
      ); 
      echo json_encode($data); 
    } 
} 
} 

：
1）入力[ 'ファイル']の値が渡されますされていないが、唯一の入力[」 text ']などの値が渡されます。
2）入力['file']（ファイル値が渡されないためオフコース）のフォーム検証エラーです。私がこれまで行ってきた何

：
1）私は、AJAXでそれをコメントし、フォームデータを受け入れるように複数のタイプを試してみました。
2）jquery.form.min.jsプラグイン（リンク：http://malsup.com/jquery/form/）を試しました。このプラグインを使用した後、input ['file']値はacceptet（コンソールでトレース）を取得できますが、コントローラに渡されることはありません。
3）ProcessData：false、contentType：falseも使用されます。
4）enctype = "multipart/form-data"も含まれています。

ファイナル説明 上記のコードは、既存のプロジェクトの別のコントローラとビューで完全に動作していますが、同じコードをコピーしましたが、現在のコントローラでは機能しません。助けが必要です、ありがとう。

ユーザーによって提案された更新AJAXコード：しかし、null値が答えに続き補正 と答えの

<script> 
$(document).ready(function() { 
    $(".accomodation").click(function(e) { 
     e.preventDefault(); 
     var formData = new FormData(this); 
     $.ajax({ 
      type: "POST", 
      url: "<?php echo site_url('admin/students/update_accomodation'); ?>", 
      data: formData, 
      cache: false, 
      contentType: false, 
      processData: false, 
      success: function(res) { 
       console.log(res); 
      } 

     }); 
    });  
}); 

受け入れをコントローラに渡されるとして、それは、私のために動作しません。私のために働く、ありがとうございます。

var form = $('#accform'); 
var formData = new FormData(form[0]); 

代わり

var formData = new FormData(this); 

Answer 1

.serializeは（）jqueryの& Axajを使用してファイルをアップロードするために受け入れることはできません。こんにちは、私はすでに解決策の上にチェックが、上記のコードは、別の作業をしているため、それは、コードに見た後、私のために、他の提案を動作しません。この使用に

$(document).ready(function (e) { 
    $('.accomodation').on('submit',(function(e) { 
     e.preventDefault(); 
     var formData = new FormData(this); 

     $.ajax({ 
      type:'POST', 
      url: $(this).attr('action'), 
      data:formData, 
      cache:false, 
      contentType: false, 
      processData: false, 
      success:function(data){ 
       console.log("success"); 
       console.log(data); 
      }, 
      error: function(data){ 
       console.log("error"); 
       console.log(data); 
      } 
     }); 
    })); 
    }));