Send a form with JavaScript

A plain HTML form works without any JavaScript. If you’d rather stay on the page and show your own message, send the form with fetch and ask for JSON.

HTML
<form id="contact" action="https://api.formdoc.dev/v1/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
  <input type="text" name="name" required>
  <input type="email" name="email" required>
  <textarea name="message" required></textarea>
  <input type="checkbox" name="botcheck" style="display:none" tabindex="-1" autocomplete="off">
  <button type="submit">Send</button>
  <p id="status" role="status"></p>
</form>

<script>
  const form = document.getElementById("contact");
  const status = document.getElementById("status");

  form.addEventListener("submit", async (event) => {
    event.preventDefault();
    status.textContent = "Sending…";
    const res = await fetch(form.action, {
      method: "POST",
      headers: { Accept: "application/json" },
      body: new FormData(form),
    });
    const result = await res.json();
    status.textContent = result.success ? "Thanks, message sent." : result.error.message;
    if (result.success) form.reset();
  });
</script>

Because the form keeps its action, it still works if the script doesn’t load. Every error code is listed in the API reference.