0

I need to upload a file in my server on file input change. I used the library for file input from Codeigniter.

index

<form class="image" method="POST">
    <input id="image-value" data-id="{{id}}" name="{{picture}}" class="image-box-{{id}}" data-type="{{type}}" type="file" value="{{picture}}" />
</form>

here is the view where I made a form that accepts an image

script

$('[id="image-value"]').change(function(e) {
 var file_data = $(this).prop('files')[0];   
 var form_data = new FormData();

 form_data.append('file', file_data);

 $.ajax({ // 02102016 AA: picture_caption
    url: './upload_picture/',
    dataType: 'json',
    cache: false,
    contentType: false,
    processData: false,
    data: form_data,                         
    type: 'post',
    success: function(data){
        alert(data);
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.error("The following error occured: " + textStatus, errorThrown);
    }
});

when triggered, the script gets the file from the index and send it to my controller

controller

function __construct() {
    parent::__construct();
    $config['upload_path'] = './data/picture/';
    $config['allowed_types'] = 'gif|jpg|png|jpeg';
    $this->load->library('upload', $config);
    $this->upload->initialize($config);
}

function upload_picture() {
// $data = Array();
log_message("debug", "do_upload: ".$this->upload->do_upload());
if ($this->upload->do_upload()) {
    log_message("debug", "data: ".$this->upload->data());
}

the problem (i think) is in how i passed the data from my controller as the value of do_upload is still false even the the data has been passed from the script

I found a great solution!

turns out it just needed "file" as do_upload() parameter. thanks for this great article! saved my life!

4
  • missing enctype="multipart/form-data" in your form Commented Mar 1, 2016 at 6:33
  • @VinodVT, i added <form class="image" method="POST" enctype="multipart/form-data"> but i still get false Commented Mar 1, 2016 at 6:36
  • didn't you missing action of form Commented Mar 1, 2016 at 6:39
  • i think it doesnt need an action because it can be triggered with my script @AnmolRaghuvanshiVersion1.0 Commented Mar 1, 2016 at 6:40

1 Answer 1

0

Function name included but controller name not included ..

$('[id="image-value"]').change(function(e) {
var file_data = $(this).prop('files')[0];   
var form_data = new FormData();

form_data.append('file', file_data);

$.ajax({ // 02102016 AA: picture_caption
url: 'controllerName/upload_picture/', //add the controller.
dataType: 'json',
cache: false,
contentType: false,
processData: false,
data: form_data,                         
type: 'post',
success: function(data){
    alert(data);
},
error: function(jqXHR, textStatus, errorThrown) {
    console.error("The following error occured: " + textStatus, errorThrown);
}

});

controller

    $var = $_POST['file'];
    print_r($var);
     if($this->input->post('file')) {

    $config['upload_path'] = 'upload'; 
    $config['file_name'] = $var; // this may be needed
    $config['overwrite'] = 'TRUE';
    $config["allowed_types"] = 'jpg|jpeg|png|gif';
    $config["max_size"] = '1024';
    $config["max_width"] = '400';
    $config["max_height"] = '400';
    $this->load->library('upload', $config);

    if(!$this->upload->do_upload()) {               
        $this->data['error'] = $this->upload->display_errors();
        print_r( $this->data['error']);
    } else {
        print_r("success");                                      
    }
Sign up to request clarification or add additional context in comments.

1 Comment

this isnt the case. my controller is called as the log is displayed.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.