CODEWITHSUNDEEP
jquerylaravel-5laravel-5.3dropzone.js
netx
netx

Reputation: 129

laravel dropzone combine form error 405 (Method Not Allowed)

Good day, i've successfully combined dropzone with normal form and it works but everytine i try update a post (user content) using Method PUT or PATCH, i get error 405 (Method Not Allowed). post update works without dropzone but i get error 405 (Method Not Allowed) when image is added to dropzone

            <form id="addproduct" enctype="multipart/form-data" method="POST" action="{{ route('admin.posts.update', $post->id) }}">
                {{ csrf_field() }}
                {{method_field('PATCH')}}

                <input class="form-control" name="title">
                <div id="myAwesomeDropzone" class="dropzone"></div>
                <button type="button" id="submit_form" class="btn btn-primary">Send</button>
            </form>


            <script>

            Dropzone.options.myAwesomeDropzone = {
                url: '/admin/posts/{!! json_encode($post->id) !!}',
                method: 'PUT',
                autoProcessQueue: false,
                uploadMultiple: true,
                parallelUploads: 3,
                maxFiles: 3,
                addRemoveLinks: true,
                thumbnailMethod: 'crop',
                resizeWidth: 500,
                resizeHeight: 500,
                resizeQuality: 0.3,
                acceptedFiles: ".jpg, .jpeg, .png",
                dictDefaultMessage: "Drop your files here!",


                init: function () {
                    var myDropzone = this;
                    $('#submit_form').on("click", function (e) {
                        e.preventDefault();
                        e.stopPropagation();
                        myDropzone.processQueue();      
                    });



                    this.on("sending", function(file, xhr, formData){
                        $('#addproduct').each(function() {
                            title = $(this).find('input[name="title"]').val();
                            formData.append('title', title);
                        });
                    });
                    this.on("success", function(file, response) {

                    });
                    this.on("completemultiple", function(files) {
                        // Here goes what you want to do when the upload is done
                        // Redirect, reload , load content ......

                    });
                },

            };

            </script>

Upvotes: 0

Views: 2990

Answers (1)

user320487
user320487

Reputation:

Try changing the method to POST and attaching the _method and _token inputs to the formData sent. Everytime I use an HTTP verb that is not GET, HEAD, or POST, I include those fields and POST to the URL.

Upvotes: 2

Related Questions