Upload file with ajax and formData

Question

I'm trying to upload a video to the Dailymotion API with ajax.

In my script i have :

                //upload the video and get the url
                var xhr =  new XMLHttpRequest();
                xhr.open('POST', upload_url, true);
                var formData = new FormData(document.getElementById("myForm"));
                xhr.send(formData);

My script is working but i have a problem, how can I specify which file field i want to use ?

If you see var formData = new FormData(document.getElementById("myForm"));, myForm is the entire form, if my file input has id="myInput", how can i specify that ?

I don't want to send all my form, but just one specific field.

Thanks !

Is it an <input type="file" ,if yes then you can use document.getElementById('myInput').files[0]; — Varun
– Varun, Commented Jun 16, 2015 at 16:50

Clément Andraud · Accepted Answer · 2015-06-16 16:55:11Z

1

This do what i want :

var file = document.getElementById("myInput").files[0];
var formData = new FormData();
formData.append('file', file);

answered Jun 16, 2015 at 16:55

Clément Andraud

9,26927 gold badges89 silver badges162 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

CoqPwner · Accepted Answer · 2015-06-16 16:51:06Z

0

Create en empty FormData and add the file value to it manually:

var file = document.getElementById("myInput").value;
var formData = new FormData();
formData.append('file', file);

answered Jun 16, 2015 at 16:51

CoqPwner

9641 gold badge13 silver badges26 bronze badges

Collectives™ on Stack Overflow

Upload file with ajax and formData

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related