Dropzone if there is error else how ?

if there is an error show it and stop upload else upload files

This code is working but when I upload images then I upload another type not image it shows the success message with the error message

const dropzone = new Dropzone(
            'div#img-drag-zone', {
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: url,
                method: 'post',
                paramName: 'uploads',
                maxFilesize: 10,
                maxFiles: 5,
                previewTemplate: previewTemplate,
                previewsContainer: "#img-preview-uploads",
                clickable: "div#img-upload-clickable",
                acceptedFiles: "image/png,image/jpeg, image/gif",
                init: function() {
                    this.on("error", function(file, response) {
                        dropzone.removeAllFiles(true);
                        $('.img-uploader-box').removeClass('d-none');
                        $('.img-reset-button').addClass('d-none');
                        swal("Opps !", response, {
                            icon: "error",
                            buttons: {
                                confirm: {
                                    className: 'btn btn-danger'
                                }
                            },
                        });
                    });
                    this.on('success', function() {
                        this.on("queuecomplete", function() {
                            Imgsuccess.removeClass('d-none');
                        });
                    });
                },

jlrdw

5 years ago

Level 75

Go by response codes wrapped in if statements:

                    if (response.status === 200) {
                        response.json().then(function (data) {
                            //console.log(data.type, data.message)
                            var div = document.getElementById('msg');
                            for (var key in data) {
                                div.innerHTML += data[key];
                            }
                        })
                    }
                    if (response.status === 422) {
                        response.json().then(function (data) {
                            //console.log(data.type, data.message)
                            var div = document.getElementById('msg');
                            for (var key in data) {
                                div.innerHTML += data[key];
                            }
                        })
                    }
                    if (response.status === 403 || response.status === 500) {
                        response.json().then(function (data) {
                            var div = document.getElementById('msg');
                            div.innerHTML += "Not Authorized";

                        })
                    }

                })

                .catch((error) => {
                    console.error('Error:', error);
                    document.getElementById('msg').innerHTML = "An error occured";
                });

Just partial example.

Please or to participate in this conversation.