JavaScript form

If you prefer to send data without reloading the page, you can use JavaScript with fetch to submit the form asynchronously. This gives you full control over the user experience after submission.

Submit with fetch

<form id="my-form">
  <input type="text" name="name" placeholder="Your name">
  <input type="email" name="email" placeholder="Your email">
  <textarea name="message" placeholder="Your message"></textarea>
  <button type="submit">Send</button>
</form>

<script>
  const form = document.getElementById('my-form');

  form.addEventListener('submit', async function (e) {
    e.preventDefault();

    const formData = new FormData(form);

    const response = await fetch('https://simpleapiform.com/f/{form_id}', {
      method: 'POST',
      body: formData,
    });

    if (response.ok) {
      console.log('Submission successful');
      // Show a success message or redirect the user
    } else {
      console.error('There was an error sending the form');
    }
  });
</script>

Submit with JSON

const response = await fetch('https://simpleapiform.com/f/{form_id}', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    name: 'Ana Garcia',
    email: '[email protected]',
    message: 'Hello, I would like more information.',
  }),
});

Server response

The service returns a JSON response with the result of the submission:

{
  "success": true,
  "message": "Form submitted successfully"
}

You can use this response to show a confirmation message, clear the form, or redirect the user from your own code.

Tip: When you submit a form with JavaScript, the redirect configured in the dashboard does not apply automatically. Redirects and confirmation messages stay under your frontend control.