Question

我正在尝试使用jquery将图像上传到codeginter中的文件夹。但我无法得到图像没有上传并向我显示消息的确切问题

您没有选择要上传的文件。

我无法理解为什么没有选择要在此处上传文件。她是我的PHP代码

public function add_new_book()
    {

    $image = $this->input->post('bookfile');
    $img=$this->input->post('bookfile');
    $config['upload_path'] = '/uploads'; 
    $config['overwrite'] = 'TRUE';
    $config["allowed_types"] = 'jpg|jpeg|png|gif';
    $config["max_size"] = '1400';
    $config["max_width"] = '1400';
    $config["max_height"] = '1400';
    $this->load->library('upload', $config);

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

    }

我在这里编写jquery代码

$( document ).ready(function() { 
     $("#btnsavebook").click(function(){ 

if($("#bookfileid").val() != ''){
        if (typeof FormData !== 'undefined') {

    var formData = new FormData($("#form-upload")[0]);
    console.log("formdata:",formData)
    $.ajax({
      type: "POST",
      url: "CreateBook/add_new_book",
      data: formData,
      mimeType:"multipart/form-data",
      dataType: 'json',
      xhr: function() {
            var myXhr = $.ajaxSettings.xhr();
            return myXhr;
      },
      cache:false,                    
      contentType: false,
      processData: false,
      success: function(result){ 
      }                       
    }); 
   } } 
});});

有人请告诉我如何实现这个过程？

由于

Answer 1

试试这个

查看文件

    <html>
<head>
<title>Ajax Image Upload Using PHP and jQuery</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<form id="uploadimage" action="" method="post" enctype="multipart/form-data">
<div id="selectImage">
<label>Select Your Image</label><br/>
<input type="file" name="my_image" id="my_image" required />
<input type="submit" value="Upload" class="submit" />
</div>
</form>
<h4 id='loading' >loading..</h4>
<div id="message"></div>
</body>
</html>
<script type="text/javascript">

$(document).ready(function (e) {
$("#uploadimage").on('submit',(function(e) {
e.preventDefault();
$("#message").empty();
$('#loading').show();
$.ajax({
url: "<?php echo base_url('test/hello'); ?>", // Url to which the request is send
type: "POST",             // Type of request to be send, called as method
data: new FormData(this), // Data sent to server, a set of key/value pairs (i.e. form fields and values)
contentType: false,       // The content type used when sending data to the server.
cache: false,             // To unable request pages to be cached
processData:false,        // To send DOMDocument or non processed data file it is set to false
success: function(data)   // A function to be called if request succeeds
{
$('#loading').hide();
$("#message").html(data);
}
});
}));
});
</script>

<强>控制器

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Test extends CI_Controller {

    public function __construct ()
    {
        parent::__construct();
    }

    public function index()
    {
        $this->load->view('test');
    }

    public function hello()
    { 
        // print_r($_FILES['file']); die;
        $config['upload_path']        = 'uploads';
        $config['allowed_types']        = 'gif|jpg|png|jpeg'; // allowed file formats
        $this->load->library('upload', $config);
        if ( ! $this->upload->do_upload('my_image')) 
        {
            echo $this->upload->display_errors(); // It will return errors if file not uploaded
        }
        else
        {
            echo "uploaded";
        }
    }
}

来源： https://www.formget.com/ajax-image-upload-php/

在codeigniter中使用jquery不上传图像

1 个答案: