Formdata object always empty..

Hey guys

I'm trying to submit a form within formdata.. the request is always empty...

this is my code ...

  submitAddBook() {
                this.disabled = true;
                let validate = this.validateData()
                if (validate) {
                    this.$Progress.start()
                    let body = new FormData()
                  
                        body.append('photo', this.book.photo)
                        body.append('file', this.book.audio_link)
                        body.append('categories', this.book.categories)
                        body.append('title', this.book.title)
                        body.append('description', this.book.description)
                        body.append('isbn', this.book.isbn)
                        body.append('published_year', this.book.published_year)


                   
            

                    axios.post('/api/book/save', {
                            body:body
                        })
                        .then((response) => {
                            this.$Progress.finish()
                            if (response.data.status == 200) {
                                swal2.fire({
                                    type: 'success',
                                    title: 'Livre ajouté avec succés',
                                    allowOutsideClick: false,
                                    showConfirmButton: true,
                                    confirmButtonText: 'Fermer'


                                }).then((result) => {
                                    if (result.value) {
                                        window.location = '/books';
                                    }
                                })
                            }
                        })
                        .catch((error) => {
                            this.$Progress.fail()
                            this.disabled = false;
                            if (error.response.status == 422) {
                                this.errors = []
                                let errors = Object.values(error.response.data.errors);
                                errors = _.flatMap(errors);
                                this.errors = errors;


                                window.scrollTo(0, 0);
                            }
                        });


                }




            }

When I try log the variable I get this :

 FormData {}__proto__: FormData

I could access the variable but I couldn't pass it...

 console.log(...body)

MichalOravec

5 years ago

Level 75

@atef95 Add fields to the form data with set and for files use append, also set Content-Type to multipart/form-data like

let body = new FormData();

body.append('photo', this.book.photo);

body.append('file', this.book.audio_link);

body.set('categories', this.book.categories);

body.set('title', this.book.title);

body.set('description', this.book.description);

body.set('isbn', this.book.isbn);

body.set('published_year', this.book.published_year);

axios.post('/api/book/save', {
    body:body,
    headers: {'Content-Type': 'multipart/form-data' }
})

Please or to participate in this conversation.