Home > Software engineering >  FormData won't load inputs of form
FormData won't load inputs of form

Time:12-17

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)

CodePudding user response:

  1. You can iterate through the Iterator: https://developer.mozilla.org/en-US/docs/Web/API/FormData/entries

  2. You can get the values one by one: https://developer.mozilla.org/en-US/docs/Web/API/FormData/get

  • Related