Laravel 5 and DropzoneJS

You have to set autoProcessQueue to false, check this link

http://stackoverflow.com/questions/21232444/dropzone-js-onclick-submit-file-upload

https://github.com/enyo/dropzone/wiki/Combine-normal-form-with-Dropzone

If im submitting the files to be uploaded with the rest of the form why must i provide a url in the configuration?

On submit am i still having to upload the images first ? and then return back to submit the rest of the form on success of the images?

You dont have to provide url in configuration

@maxnb

If i dont provide a url the dropzone stops working.

With a console error of "dropzone.min.js:1Uncaught Error: No URL provided."

Okay ive taken a step back let me show you some code.

Html

    {{Form::open(['route' => 'admin-event-store', 'id' => 'create-event-form'])}}

                <section id="event-create-header">
                    <h4>Header</h4>

                    <div class="form-group">
                        <input name="hero_image" type="file" class="">
                    </div>

                    <div class="form-group">
                        <input placeholder="Title" type="text" class="form-control" name="title">
                    </div>

                    <br>
                </section>

                <section id="event-create-attachment">
                    <h4>Attachments</h4>

                    <div class="dropzone"
                         id="eventCreateAttachment">

                    </div>
                    <br>
                </section>

                <div class="form-group">
                    <div class="row">
                        <div class="col-sm-2">
                            {{Form::submit('Save', ['class' => 'btn btn-primary btn-block', 'id' => 'create-event-submit'])}}
                        </div>
                    </div>
                </div>

                {{ Form::close() }}

JS

    var myDropZone = $("#eventCreateAttachment").dropzone({
        url: '/events',
        autoProcessQueue: false,
    });

controller

    public function store(Request $request)
    {
        return $request->all();
    }

Why when i submit this form i dont see the dropzone uploads. but i can see the title input and hero image file in my request object?

My use case for dropzone was to allow a user to see the multiple files they are about to upload and also make edits like remove and in the future i want an edit page so they can see the attachments pre populated and remove existing ones or add new ones. Can i still achieve this?

When you are creating dropzone you are not attaching it to the form, you attach it to the div with id eventCreateAttachment so thats why dropzone cant find url unless you set it in options

@maxnb

Thats because i did not want my entire form to be a dropzone, like i mentioned i wanted to use this with my existing form data.. If you have used dropzone before can you read my usecase and let me know if this is an appropriate case to use dropzone .

I my self just recently started using dropzone. I am building image hosting website where users can upload images and decided that I need drag and drop functionallity on the form.

You say: "i want an edit page so they can see the attachments pre populated and remove existing ones or add new ones." Do you want to show these already uploaded attachements in the dropzone? You dont need dropzone for that, just put these already uploaded attachments inside a div with links to delete each individual attachment. Then below that you can put dropzone if you want user to be able to upload new attachments on the edit page.

@maxnb

You only commeted on the second part of my usecase. The main bit is having an area where a user can drop and drag files. Without having to select them all at once and also remove ones they dont want and then upload like normally with a single click of submit button which also submits the rest of my form. the ajax uploading is not what im interested in. So you are saying dropzone can't do this for me?

I think dropzone can do that for you. To remove the files after the user has draged and droped them you have to enable addRemoveLinks: true, that will remove the file before it gets uploaded.

@KHAN Hello! I've recently started working with dropzone and I have the same issue as the one you described. I know this subject is old, but I could use some help. Did you manage to find a solution? Thank you!