Blueimp jQuery file upload and symfony2 : issue with custom upload handler

Question

I'm using Symfony2 and I would like to use the BlueImp plugin, basic setup.

Actually, I have a form in which you can load 3 pictures and one song (it is for an artist registration).

As a start, I try to implement the plugin for just one picture. But when I select a file in my input "picture 1", nothing happens.. What is wrong ?

<html>
 <head>
    <script type="text/javascript"  src="{{ asset('bundles/mybundle/js/jquery-file-upload/js/vendor/jquery.ui.widget.js') }}"></script>
    <script type="text/javascript"  src="{{ asset('bundles/mybundle/js/jquery-file-upload/js/jquery.iframe-transport.js') }}"></script>
    <script type="text/javascript"  src="{{ asset('bundles/mybundle/js/jquery-file-upload/js/jquery.fileupload.js') }}"></script>
  </head>


 <form id="myForm" action="{{ path('MyBundle_artist_new') }}" {{ form_enctype(form) }} method="post" novalidate>
     <div class="field">
        {{ form_label(form.picture1 "Picture 1") }}
        {{ form_widget(form.picture1) }}
      </div>
      <input type="submit" value="Register"/>
</form>

<script type="text/javascript">

$(document).ready(function(){

    $('#myform_picture1').fileupload(
    {
        dataType: 'json',
        url:'{{path('MyBundle_ajax_upload_picture') }}',
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p/>').text(file.name).appendTo(document.body);
            });
        }
    });
  });
</script>

Here is upload handler (the action for the url {{path('MyBundle_ajax_upload_picture') }} :

<?php

    public function ajaxUploadPicture()
    {
        $request = $this->get('request');
        $uploaded_file = $request->files->get('myform_picture1');

        if ($uploaded_file) 
        {
            $picture1 = $this->processImage($uploaded_file);
            $picture1->setPath('pictures/artist/' . $picture1);
            $em->persist($picture1);
            $em->flush();

            $response = 'success';
        }

        else $response= 'error';

        $response = new Response(json_encode(array('response'=>$response)));
        $response->headers->set('Content-Type', 'application/json');
        return $response;
    }

    public static function processImage(UploadedFile $uploaded_file)
    {
        $path = 'pictures/artist/';
        $uploaded_file_info = pathinfo($uploaded_file->getClientOriginalName());
        $filename = uniqid() . "." .$uploaded_file_info['extension'];

        $uploaded_file->move($path, $filename);

        return $filename;
    }

l3l0 · Accepted Answer · 2013-02-14 11:11:55Z

1

You should check what you get from ajax request ex:

$('#myform_picture1').fileupload(
{
    dataType: 'json',
    url:'{{path('MyBundle_ajax_upload_picture') }}',
    done: function (e, data) {
        $.each(data.result.files, function (index, file) {
            $('<p/>').text(file.name).appendTo(document.body);
        });
    },
    always: function (e, data) {
       console.log(data);
    }
});

I am not sure about this line $uploaded_file = $request->files->get('myform_picture1'); you sure that your file input name is myform_picture1 ?

Please try $uploaded_file = $request->files->get('myform[picture1]', array(), true);

answered Feb 14, 2013 at 11:11

l3l0

3,38322 silver badges19 bronze badges

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

3 Comments

Reveclair Over a year ago

Thanks for your reply but I always have a 500 Internal Server Error in my firebug console, and it is not an input name issue as i try with this <input type="file" name="foo" id="test" /> and $uploaded_file = $request->files->get('foo', array(), true); and it is not working unfortunately.

l3l0 Over a year ago

Please use app_dev.php main controller and check in firebug what cause 500 error

Reveclair Over a year ago

Ok I find the problem thanks to your help! It was silly but I forgot to add the word "Action" at the end of my method ajaxPictureUpload.

Collectives™ on Stack Overflow

Blueimp jQuery file upload and symfony2 : issue with custom upload handler

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related