Menu
I'm trying to get a set of keys (input names or similar) and values (input values) from a web form:
<body> <form> <input type="text" name="banana" value="swag"> </form> <script> var form = document.querySelector('form'); var formData = new FormData(form); </script> </body> According to the FormData documentation, formData should contain the keys and values from the form. But console.log(formData) shows formData is empty.
How can I quickly get the data from the form using FormData?
JSFiddle
239
Solution. When you initialize FormData() from a form element, it'll only map input fields that have a name attribute. Only these mapped input fields are included in the form data that is sent in requests. Hence, when none of the input fields are mapped, the form data will be empty.
val(); if(name && pret){ $. ajax({ url: 'connect. php', type: 'POST', data: formData, async: false, cache: false, contentType: false, processData: false, success: function(){ alert('uploaded successuflly! '); } }); }else{alert('input fields cannot be left empty you num num!
FormData wil support multi file upload. Should work great! NOTE: You may find that the FILES array is empty on server side page - In this case you need to make sure your server configuration allows file uploads, size limit of file upload is enough, post time is enough etc....
Update: the XHR spec now includes several more functions to inspect FormData objects.
FireFox has supported the newer functions since v39.0, Chrome is slated to get support in v50. Not sure about other browsers.
var form = document.querySelector('form'); var formData = new FormData(form); for (var [key, value] of formData.entries()) { console.log(key, value); } //or console.log(...formData) If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
