My Code
<!DOCTYPE html>
<html>
<body>
<div id="form-sample">
<form enctype="multipart/form-data">
<input type="text" name="sample-text" />
<input type="radio" name="sample-radio" value="yes" />
<input type="radio" name="sample-radio" value="no" />
<input type="file" name="images[]" multiple="multiple" />
<input type="submit" value="Fetch Data" />
</form>
</div>
<script>
function onSubmitForm(e) {
e.preventDefault();
const fD = new FormData(document.querySelector("#form-sample form"));
console.log(fD.entries()); // get an empty FormData Iterator
}
document.addEventListener('DOMContentLoaded', function(e) {
document.querySelector("#form-sample form").addEventListener("submit", onSubmitForm, false);
});
</script>
</body>
</html>Why doesn't FormData load the <form> inputs and why is that not returning an exception?
Actually trying this code on latest Firefox version (v95.0)
You can iterate through the Iterator: https://developer.mozilla.org/en-US/docs/Web/API/FormData/entries
You can get the values one by one: https://developer.mozilla.org/en-US/docs/Web/API/FormData/get