How to send multipart/form-data with image and fields

[Khalil]

If anyone has set up this case please share your code.

My form has the following fields

• First Name
• Last Name
• Email
• User Avatar (File)

[uwla]

I also would like to know how to send files using vform!

[uwla]

I have found a solution to your problem on StackOverflow and it has worked for me too!

The code goes something like that

// in vue template
<input type="file" @input="addFile" name="avatar">

// js
import { objectToFormData } from 'object-to-formdata' // you must install it with npm install

// in the component object
        data() {
            return {
                    form: new VueForm({fname: "", lname: "", email: "", avatar: ""})
            }
        }
// in methods
        addUser() {
            this.form.post('users', {transformRequest: [data => objectToFormData(data)]})
                .then(res => window.alert("success"))
                .catch(error => console.log(error))
        },
        addFile() {
             this.form.avatar = window.event.target.files[0]
        }

[Isabela de França]

@AndreSouzaAbreu I tried you're code but that also doesn't work by me.

check this example https://github.com/cretueusebiu/vform/blob/master/example/upload.html
instead of getting his cdn script, I just coppied the function to my head and also tested for null fields