JSFiddle - React, Tailwind, and code Playground

by ShaCP

HTML

<form action="my_form" method="post">
  <div>
    <label for="name">Name:</label>
    <input type="text" id="name" name="user_name">
  </div>

  <div>
    <label for="mail">E-mail:</label>
    <input type="email" id="mail" name="user_email">
  </div>

  <div>
    <label for="msg">Message:</label>
    <textarea id="msg" name="user_message"></textarea>
  </div>

  <div class="button">
    <button type="submit">Send your message</button>
  </div>
</form>

JavaScript

formSubmissionHandler = (e) => {
      e.preventDefault();
      this.formData = new FormData(this.form);
      for(const entry of this.formData.entries()) {
        console.log(`${entry[0] }, ${ entry[1]}`);
     }
  }
  
  my_form.addEventListener("submit", formSubmissionHandler);