> ## Documentation Index
> Fetch the complete documentation index at: https://docs.formbox.app/llms.txt
> Use this file to discover all available pages before exploring further.

# AJAX support

> Learn how to use AJAX with the **fetch** API in your handle submissions on your form.

## What is AJAX?

AJAX or <a href="https://developer.mozilla.org/en-US/docs/Glossary/AJAX" target="_blank" rel="noopener noreferrer">Asynchronous JavaScript and XML</a> is described by MDN as a web development technique in which a web app fetches content from the server by making asynchronous HTTP requests, and uses the new content to update the relevant parts of the page without requiring a full page load.

### Using the Fetch API

The <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API" target="_blank" rel="noopener noreferrer">Fetch API</a> provides a JavaScript interface for accessing and manipulating parts of the HTTP pipeline, such as requests and responses. It also provides a global `fetch()` method that provides an easy, logical way to fetch resources asynchronously across the network. It is a more powerful and flexible replacement for <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" target="_blank" rel="noopener noreferrer">XMLHttpRequest</a>.

We will use the it to send your form data to Formbox's server to handle the submissions.

Lets start with a simple example:

```html theme={null}
<script>
  fetch("https://api.formbox.app/s/{your_form_id}", {
    method: "POST",
    headers: { "Content-Type": "application/json", Accept: "application/json" },
    body: JSON.stringify({
      name: "Jason",
      email: "jason@example.com",
      message: "Hello World",
    }),
  })
    .then((response) => console.log(response))
    .catch((error) => console.log(error));
</script>
```

Example output:

```json theme={null}
{ "success": true, "status": 200 }
```

This will work for any tech stack you are using, such as with React, Vue, Angular, or even vanilla JavaScript.