“您没有选择要上传的文件。”使用ajax上传图片时出现此错误

问题描述：

我正在使用CodeIgniter和jQuery ajax。我想用ajax上传图片。但它表明像You did not select a file to upload.“您没有选择要上传的文件。”使用ajax上传图片时出现此错误

错误在这里，我写的jQuery：

jQuery(document).on('submit', '#signup_form', function() 
 
\t \t { 
 
\t \t \t //debugger; 
 
\t \t \t var data = jQuery(this).serialize(); 
 
\t \t \t jQuery.ajax({ 
 
\t \t \t \t type : 'POST', 
 
\t \t \t \t url : '<?php echo base_url()."front/ajax_register"; ?>', 
 
\t \t \t \t data : data, 
 
\t \t \t \t success : function(data) 
 
\t \t \t \t { 
 
\t \t \t \t \t jQuery(".result").html(data); 
 
\t \t \t \t } 
 
\t \t \t }); 
 
\t \t \t return false; 
 
\t \t });

<form id="signup_form" method="post" enctype="multipart/form-data"> 
 
    <div class="row"> 
 
     <div class="col-md-3">Upload Photo</div> 
 
     <div class="col-md-4"> 
 
      <input type="file" name="pic" accept="image/*"> 
 
     </div> 
 
    </div> 
 
    <div class="row"> 
 
     <button type="submit" class="btn btn-default">Submit</button>  
 
    </div> 
 
</form>

和我的函数如下所示：

function ajax_register() 
{ 
    if($this->input->post()) 
    { 
     $this->form_validation->set_rules('pass', 'Password', 'required|matches[cpass]'); 
     $this->form_validation->set_rules('cpass', 'Password Confirmation', 'required'); 

     if($this->form_validation->run() == true) 
     { 
      $img = ""; 
      $config['upload_path'] = './uploads/user/'; 
      $config['allowed_types'] = 'gif|jpg|png|jpeg'; 
      $this->upload->initialize($config); 

      if (! $this->upload->do_upload('pic')) 
      { 
       $data['error'] = array('error' => $this->upload->display_errors()); 
       print_r($data['error']);exit; 
       $data['flash_message'] = "Record is not inserted"; 
      } 
      else 
      { 
       $upload = $this->upload->data(); 
       //print_r($upload);exit; 
       $data = array(
         'ip_address'   =>$this->input->ip_address(), 
         'first_name'   =>$this->input->post('firstname'), 
         'last_name'    =>$this->input->post('lastname'), 
         'phone'     =>$this->input->post('phone'), 
         'email'     =>$this->input->post('email'), 
         'group_id'    =>$this->input->post('role'), 
         'password'    =>$this->input->post('password'), 
         'image'     =>$upload['file_name'], 
         'date_of_registration' =>date('Y-m-d') 
        ); 
       print_r($data);exit; 
       $user_id = $this->admin_model->insert_user($data); 

       $user_group = array(
         'user_id' => $user_id, 
         'group_id' => $this->input->post('role') 
        ); 

       $this->admin_model->insert_group_user($user_group); 
       echo "<p style='color:red;'>You are successfully registerd.</p>";     
      } 
     } 
     else 
     { 
      echo "<p style='color:red;'>".validation_errors()."</p>"; 
     } 
    } 
}

那么如何解决这个问题？我的代码中需要更改哪些内容？

问题是正确的这一行：'VAR数据= jQuery的（本）.serialize（）;'，如果你序列化数据，适当选择的文件将会丢失，不要提交请求 – Drkdra

''image'=> $ upload ['file_name']''的预期结果是什么？ – guest271314

@ guest271314它会给图像名称，所以我可以将它存储到数据库中。 –

答

正如我所说的，这个问题可能是你发送到后端数据。如果你想用输入文件提交AJAX，使用FormData。

试试这个：

jQuery(document).on('submit', '#signup_form', function() 
{ 
    //debugger; 
    var data = new FormData($('#signup_form')[0]); 

    jQuery.ajax({ 
     type : 'POST', 
     url : '<?php echo base_url()."front/ajax_register"; ?>', 
     data : data, 
     processData: false, 
     contentType: false, 
     success : function(data) 
     { 
      jQuery(".result").html(data); 
     } 
    }); 
    return false; 
});

答

试试这个：

$('#upload').on('click', function() { 
     var file_data = $('#pic').prop('files')[0]; 
     var form_data = new FormData(); 
     form_data.append('file', file_data); 

     $.ajax({ 
       url   : 'upload.php',  // point to server-side PHP script 
       dataType : 'text',   // what to expect back from the PHP script, if anything 
       cache  : false, 
       contentType : false, 
       processData : false, 
       data  : form_data,       
       type  : 'post', 
       success  : function(output){ 
        alert(output);    // display response from the PHP script, if any 
       } 
     }); 
     $('#pic').val('');      /* Clear the file container */ 
    });

PHP的：

<?php 
    if ($_FILES['file']['error'] > 0){ 
     echo 'Error: ' . $_FILES['file']['error'] . '<br>'; 
    } 
    else { 
     if(move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name'])) 
     { 
      echo "File Uploaded Successfully"; 
     } 
    } 

?>

这将上传的文件。

P.S .:根据CI方法更改代码。

答

var data = jQuery(this).serialize();

this指document

“您没有选择要上传的文件。”使用ajax上传图片时出现此错误

相关推荐