CodeIgniter AJAX文件无法上传

时间:2017-07-12 14:42:34

标签: php jquery codeigniter

我的表单是

<?php 
      $attributes = array('id' => 'myForm');
      echo form_open_multipart('', $attributes); ?>

    <div class="form-group">
        <label for="image">Main Image</label>
        <input type="file" class="form-control-file" id="image" name="image" aria-describedby="fileHelp">
    </div>

    <div style="text-align:center">
        <button type="button" class="btn btn-primary" id="add">ADD</button>
        <button type="reset" class="btn btn-primary">Reset</button>
    </div>
<?php echo form_close(); ?>     

我的脚本如下

<script>

    $("#add").click(function () {

        var image = $("#image").val() ;

        $.ajax({
            type: "POST",
            url: "<?php echo site_url('form/addArticleData'); ?>",
            data: { 

                image: image,

            },
            dataType: "html",
            contentType: false,
            cache: false,
            processData: false,
            success: function(data) {
                if(data) {
                    alert($.trim(data));
                    $("#myForm")[0].reset();
                } else {
                    alert("Some Error Occurred. Please Try Again!!!");
                }
            }, error: function() {
                alert("ERROR!");
            }
        });
    });
</script>

我在控制器表单中的addArticleData函数包含

if(isset($_FILES["image"]["name"]))  
    { 
        $config = array(
            'upload_path' => "images",
            'allowed_types' => "*",
            'overwrite' => TRUE,
            'max_size' => "2048000", // Can be set to particular file size , here it is 2 MB(2048 Kb)
            'max_height' => "768",
            'max_width' => "1024"
        );
        $this->load->library('upload', $config);
        if($this->upload->do_upload('image'))
        {
            $data = array(

                'image' => $this->input->post('image')

            );
            //print_r($data);
            if($this->modal->insert($data, 'admin')) {
                echo "DATA INSERTED SUCCESSFULLY";
            }
        }
        else {
            echo "ERROR";
        }
    } else {
        echo "FILE NOT SET";
    }

问题在于每当我尝试执行此脚本时,它都会警告FILE NOT SET。如果我使用print_r($ _ FILES)打印$ _FILES;退出;它警告一个空数组。

此外,如果我尝试注释print_r($ data);退出;并删除它前面的所有行,然后它会警告上传的图像的名称为C:\ fakepath \ image.png

我无法理解为什么这不起作用。请帮助

1 个答案:

答案 0 :(得分:3)

.val()只会给你文件名而不是实际文件 要上传文件,您需要使用FormData对象并将文件添加到其中

$("#add").click(function () {

    var image = $("#image").prop('files')[0] ;
    var data = new FormData();
    data.append('image', image);
    $.ajax({
        type: "POST",
        url: "<?php echo site_url('form/addArticleData'); ?>",
        data: data,
        dataType: "html",
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            if(data) {
                alert($.trim(data));
                $("#myForm")[0].reset();
            } else {
                alert("Some Error Occurred. Please Try Again!!!");
            }
        }, error: function() {
            alert("ERROR!");
        }
    });
});