duan62819774
2016-01-30 08:45
浏览 51
已采纳

使用PHP-CodeIgniter上传的AJAX文件不起作用

I have been trying to upload an image with AJAX but somehow it's not working. CodeIgniter always throwing 'You have not selected any file'. Thanks in advance.

Here's my Controller -

class Upload extends CI_Controller {
    public function __construct() {
        parent::__construct();
        $this->load->helper('url');
    }

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

    public function upload_file() {
        $config['upload_path'] = './uploads/Ajax/';
        $config['allowed_types'] = 'gif|jpg|png|doc|txt';
        $config['max_size'] = 1024 * 8;

        $this->load->library('upload', $config);
        $title=$this->input->post('title');

        if (!$this->upload->do_upload('userfile')) {
            echo $this->upload->display_errors()."<br>".$title;
        }
        else {
            $data = $this->upload->data();
            echo $data['file_name']." uploaded successfully";
        }
    }
}

/* end of file */

And here's the view

<!DOCTYPE HTML>
<html>
    <head>
        <title>AJAX File Upload</title>
        <script src="<?php echo base_url(); ?>assets/js/jquery-1.11.3.js">    </script>
        <script src="<?php echo base_url(); ?>assets/js/AjaxFileUpload.js">    </script>
        <script>
            $(document).ready(function() {
                $('#upload-form').submit(function(e) {
                    e.preventDefault();
                    if (typeof FormData !== 'undefined') {
                        $.ajax({
                            url     :   '<?php echo base_url(); ?>upload/upload/upload_file',
                            type    :   'POST',
                            data    :   FormData,
                            beforeSend: function () {
                                $("#result").html("Uploading, please wait....");
                            },
                            error: function () {
                                alert("ERROR in upload");
                            },
                            success :   function(data) {
                                $('#result').html(data)
                            }
                        });
                    }
                    else {
                        alert("Your browser doesn't support FormData API!");
                    }
                });
            });
        </script>
    </head>

<body>
    <h1>Upload File</h1>
    <form method="post" action="" id="upload-form" enctype="multipart/form-data" accept-charset="utf-8">
        <p>
            <label for="title">Title</label>
            <input type="text" name="title" id="title" value="" autocomplete="off">
        </p>
        <p>
            <label for="userfile">File</label>
            <input type="file" name="userfile" id="userfile">
        </p>
        <input type="submit" name="submit" id="submit">
    </form>

    <h2>Result</h2>
    <span id="result"></span>
</body>

I have tested in Firefox 43, IE11 & Chrome 43

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

5条回答 默认 最新

相关推荐 更多相似问题