AJAX Form Submission

Submit forms without a page reload. Add one header and you're done.

POST https://000forms.com/f/YOUR_TOKEN

Overview

Point your request at your 000forms endpoint and include the Accept: application/json header. That's all — 000forms returns JSON instead of redirecting the page.

Your token — Replace YOUR_TOKEN with the token from your dashboard (e.g. f_l63kxxnb).
Methods

Fetch API Recommended

Modern and promise-based. Works natively in all current browsers — no library needed.

HTML 
<form id="myForm">
  <input type="text"  name="name"    required>
  <input type="email" name="email"   required>
  <textarea            name="message"></textarea>
  <button type="submit">Send</button>
</form>
<div id="status"></div>
JavaScript 
const form = document.getElementById('myForm');

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

  const res  = await fetch('https://000forms.com/f/YOUR_TOKEN', {
    method:  'POST',
    headers: { 'Accept': 'application/json' },
    body:    new FormData(form)
  });
  const data = await res.json();

  document.getElementById('status').textContent =
    res.ok ? '✓ ' + data.message : '✗ ' + data.message;

  if (res.ok) form.reset();
});

jQuery AJAX

If jQuery is already loaded in your project, you can use $.ajax() with a few key options.

JavaScript 
$('#myForm').on('submit', function(e) {
  e.preventDefault();

  $.ajax({
    url:         'https://000forms.com/f/YOUR_TOKEN',
    method:      'POST',
    data:        new FormData(this),
    dataType:    'json',
    processData: false,
    contentType: false,
    headers:     { 'Accept': 'application/json' },
    success: (data) => $('#status').text('✓ ' + data.message),
    error:   (xhr)  => $('#status').text('✗ ' + JSON.parse(xhr.responseText).message)
  });
});
Always set processData: false and contentType: false when passing FormData to jQuery — otherwise it won't serialize correctly.

Axios

Common in Vue and React projects. Handles JSON automatically and has clean error handling via try / catch.

JavaScript 
form.addEventListener('submit', async (e) => {
  e.preventDefault();

  try {
    const { data } = await axios.post(
      'https://000forms.com/f/YOUR_TOKEN',
      new FormData(e.target),
      { headers: { 'Accept': 'application/json' } }
    );
    console.log(data.message);
    e.target.reset();
  } catch (err) {
    console.error(err.response?.data?.message);
  }
});
Reference

Special Attributes

Add these as hidden inputs inside your form to control extra behaviour. All are optional.

NameDescriptionExample value
_subject Email subject line New contact
_redirect Redirect URL (non-AJAX only) https://yoursite.com/thanks
_cc CC to another address admin@yoursite.com
_autoresponse Auto-reply to the submitter Thanks! We'll reply soon.
_template Email template style table / box / basic
_honeypot Spam trap field (hide with CSS) _honey

JSON Responses

When Accept: application/json is set, you always receive JSON — never a redirect.

200 — Success
{
  "success": true,
  "message": "Form submitted."
}
422 — Error
{
  "success": false,
  "message": "Validation failed",
  "errors": { "email": "Required" }
}
Status codes — 200 sent  ·  422 validation failed  ·  429 rate limited

Tips

Common patterns to improve user experience when submitting forms via AJAX.

Disable button while sending

JavaScript 
const btn = form.querySelector('button[type="submit"]');
btn.disabled    = true;
btn.textContent = 'Sending…';
// re-enable inside a finally block

Send as JSON body

JavaScript 
const payload = Object.fromEntries(new FormData(form));
fetch(url, {
  method:  'POST',
  headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' },
  body:    JSON.stringify(payload)
});
CORS — 000forms allows cross-origin requests from any domain by default, so you won't need to set up any additional headers for that.

Test AJAX Live

Send real requests to your endpoint and see the live JSON response instantly.

Form Data
Response Waiting…
Hit Send to see live response.
Fetch 
await fetch('https://000forms.com/f/YOUR_TOKEN', {
  method:  'POST',
  headers: { 'Accept': 'application/json' },
  body:    new FormData(form)
});
Form Data
Response Waiting…
Hit Send to see live response.
jQuery 
$.ajax({
  url:         'https://000forms.com/f/YOUR_TOKEN',
  method:      'POST',
  processData: false,
  contentType: false,
  headers:     { 'Accept': 'application/json' }
});
Form Data
Response Waiting…
Hit Send to see live response.
Axios 
await axios.post(
  'https://000forms.com/f/YOUR_TOKEN',
  new FormData(form),
  { headers: { 'Accept': 'application/json' } }
);