1

I'm currently using the uploadify jQuery plugin to upload images to a folder. The image upload part works fine but when I try to add extra form data it gives me the error Uncaught SyntaxError: Unexpected token x.

I'm retrieving data as JSON array and my response header content type is application/json but unsure why it's throwing this error.

My question is: based on the code below why is this error occurring and what would be a solution?

jQuery:

          $('#userfile').uploadify({
                'auto':false,
                'swf': base_url + 'assets/js/jquery/uploadify_31/uploadify.swf',
                'uploader': base_url + 'post/cover_upload',
                'cancelImg': base_url + 'assets/jquery/uploadify-cancel.png',
                'fileTypeExts':'*.jpg;*.bmp;*.png;*.tif;*.gif;*.jpeg',
                'fileTypeDesc':'Image Files (.jpg,.bmp,.png,.tif,.gif,.jpeg)',
                'fileSizeLimit':'10MB',
                'fileObjName':'userfile',
                'buttonText':'Select Photo(s)',
                'multi':true,
                'removeCompleted':false,
                'onUploadSuccess' : function(file, data, response) {
                    var responseObj = JSON.parse(data);
                    if(responseObj.file_name){
                        $('#cover-image').css("background-image", "url('http://localhost:8888/SimpleBlog/uploads/"+responseObj.file_name+"')");     
                        $('#cover-image').css("background-size", "cover");
                        $('#cover-image').css("background-position", "center");
                    }
                },
                'onUploadStart' : function(file) {
                    var uri = window.location.pathname.split('/').pop();
                    $('#userfile').uploadify("settings", 'formData', {'pst_str' : uri});
                }
            });

PHP - post/cover_upload

public function cover_upload(){

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

    $image_upload_folder = FCPATH . '/uploads';

    if (!file_exists($image_upload_folder)) {
        mkdir($image_upload_folder, DIR_WRITE_MODE, true);
    }

    if($this->input->post('pst_str') == "add"){
        $pst_str = $this->create_temp_post();
    }else{
        $pst_str = $this->input->post('pst_str');
    }

    $this->upload_config = array(
        'upload_path'   => $image_upload_folder,
        'allowed_types' => 'png|jpg|jpeg|bmp|tiff',
        'max_size'      => 36000,
        'max_width'     => 10240,
        'max_height'    => 7680,
        'remove_space'  => TRUE,
        'file_name'     => random_string('alnum', 16),
        'pst_str'       => $pst_str
    );

    $this->upload->initialize($this->upload_config);

    if ( !$this->upload->do_upload() ) {
        $upload_error = $this->upload->display_errors();
        echo json_encode($upload_error);
    }else{
        header("content-type:application/json");

        $file_info = $this->upload->data();
        $this->post_model->add_cover($pst_str, $file_info['file_name']);

        echo json_encode($file_info);

    }

}

Any help is greatly appreciated.

2
  • What does your data response look like? Commented Jan 29, 2014 at 19:39
  • Like so {"client_name": "banana-gif.jpg","file_ext": ".jpg","file_name":"Rl4dmhySHWgrAsH6.jpg","file_path":"\/Applications\/MAMP/htdocs\/SimpleBlog\/uploads\/","file_size": "22.85","file_type": "image/jpeg","full_path":"\/Applications\/MAMP\/htdocs\/SimpleBlog\/uploads\/Rl4dmhySHWgrAsH6.jpg","image_height": "534","image_size_str": "width=\"950\" height=\"534\"","image_type":"jpeg","image_width": "950","is_image": true,"orig_name": "Rl4dmhySHWgrAsH6.jpg","raw_name": "Rl4dmhySHWgrAsH6"}; Commented Jan 29, 2014 at 19:47

1 Answer 1

2

It appears to be the way your JSON is formatted. Try parsing your response this way.

   if(data.file_name){
     $('#cover-image').css("background-image", "url('http://localhost:8888/SimpleBlog/uploads/"+data.file_name+"')");     
      $('#cover-image').css("background-size", "cover");
      $('#cover-image').css("background-position", "center");
    }

http://jsfiddle.net/Ef7b3/

Sign up to request clarification or add additional context in comments.

Comments

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.