Ajax upload in CodeIgniter returns "you did not select a file to upload"

Question

I'm trying to upload an image via Ajax in CodeIgniter, but I always get the error "You did not select a file to upload".

Here is the jQuery Code:

$(document).ready(function (e) {
    $('#submitUpload').bind('click', function(evt) {
        var $btn = $(this).button('loading');
        var formData = new FormData();
        var inputImage = $('#inputImage')[0];
        console.log(inputImage.files[0]);
        formData.append('file', inputImage.files[0]);
        $.ajax({
            url: baseUrl + 'trainings/uploadImageAsync',
            type: 'post',
            dataType: 'json',
            data: formData,
            contentType: false,
            cache: false,
            processData: false,
            success: function(data) {
                console.log(data);
                $btn.button('reset');
            }
        });
    });
});

This is the part with the form:

<div class="modal-body" id="bodyTrainingForm">
    <form class="form-horizontal" id="formTrainingForm" enctype="multipart/form-data">
        <div class="form-group">
            <label for="inputTitle" class="col-sm-2 control-label">Title</label>
            <div class="col-sm-9">
                <input type="text" class="form-control" id="inputTitle" name="title" placeholder="Title">
            </div>
        </div>
        <div class="form-group">
            <label for="inputImg" class="col-sm-2 control-label">Image</label>
            <div class="col-sm-9">
                <img class="img-thumbnail" src="holder.js/140x140">
                <input class="form-control" type="file" name="file" id="inputImage" required>
                <button data-loading-text="Loading..." type="button" class="btn btn-default" id="submitUpload">Upload</button>
            </div>
        </div>
    </form>
</div>

And the PHP part which seems to work:

public function uploadImageAsync()
{
    $config['upload_path'] = base_url() . 'asset/img/thumbnails/';
    $config['allowed_types'] = 'jpg|png';
    $config['max_size'] = 1024 * 8;
    $config['max_width'] = 140;
    $config['max_height'] = 140;

    $this->load->library('upload', $config);

    if (!$this->upload->do_upload()) {
        echo json_encode(array(
            'error' => $this->upload->display_errors(),
        ));
        return;
    }
    echo json_encode(array(
        'success' => $this->upload->data(),
    ));
}

console.log(inputImage.files[0]); perfectly returns the file I want to append to FormData, which doesn't seem to work. What am I missing here?

score 1 · Answer 1 · edited May 23 '17 at 12:29

1

i see. i think you should try to change the permission of folder first. I hope this can help Chmod 777 to a folder and all contents

edited May 23 '17 at 12:29

Community

1
1

answered Sep 27 '15 at 09:08

Neil Marvin Enriquez

19
4

Hey, thanks for your efforts. It turns out the permissions were set correctly all along. I just failed to correctly point to the upload directory. I shouldn't have added the `base_url()` ... The correct declaration would be `$config['upload_path'] = './assets/img/thumbnails/';` – Patrick Manser Sep 27 '15 at 12:54

score 0 · Answer 2 · answered Sep 23 '15 at 09:32

0

try to include a file in your upload->do_upload()

if(!$this->upload->do_upload('file'){ /* error */ }

answered Sep 23 '15 at 09:32

Neil Marvin Enriquez

19
4

Thanks for your answer, but I think I found out the problem, I just don't know how to solve it. The upload path seems to be unwritable, since `die(debug(is_writable($config['upload_path'])));` returns `false`. I just don't know to set the permissions right. I'm on Win10 with xampp... – Patrick Manser Sep 26 '15 at 19:13

score 0 · Accepted Answer · answered Sep 26 '15 at 19:37

0

I figured it out myself! My mistake was adding the base_url() to $config['upload_path']. Should've just done it like:

$config['upload_path'] = './assets/img/thumbnails/';

answered Sep 26 '15 at 19:37

Patrick Manser

1,133
2
12
31

Ajax upload in CodeIgniter returns "you did not select a file to upload"

3 Answers3