# Programmatic Submission

Submit form fields to FormsReach with the official @formsreach/js SDK - submitForm, npm, and CDN - without hand-written fetch.

## What you will achieve

Send submission data from JavaScript (SPA, custom UI, or server-side Node) using the official SDK instead of building your own `fetch` to the submit endpoint.

## Prerequisites

- A form and API key - [Create a form and API key](/docs/getting-started/create-form-api-key/)
- Node/npm for the package, or any page for the CDN script

## Install

```bash
npm install @formsreach/js
```

Package details: [GitHub SDK](https://github.com/formsreach/sdk/tree/main/packages/js).

## Programmatic submit with `submitForm`

```js
import { submitForm } from "@formsreach/js";

const { id, redirectUrl } = await submitForm({
 apiKey: "YOUR_ACCESS_KEY",
 data: {
 name: "Ada Lovelace",
 email: "ada@example.com",
 message: "Hello from the JS SDK",
 },
});

console.log(id, redirectUrl);
```

- `apiKey` - your form public API key
- `data` - field map (same names you would use as HTML `name` attributes)
- Return value includes submission `id` and optional `redirectUrl` when a [custom redirect](/docs/submit-api/redirect/) is configured

### Error handling

Wrap `submitForm` in `try/catch`. Failures surface status and problem details (validation, domain allowlist, credits, and so on). For a full field reference and response shape, see [Submit API overview](/docs/submit-api/overview/).

## CDN (browser)

If you are not using a bundler:

```html
<script src="https://unpkg.com/@formsreach/js/dist/formsreach.min.js"></script>
<script>
 // Auto-bind forms marked with data-formsreach (optional)
 FormsReach.init({ apiKey: "YOUR_ACCESS_KEY" });

 // Programmatic submit from your own UI
 FormsReach.submitForm({
 apiKey: "YOUR_ACCESS_KEY",
 data: {
 name: "Ada Lovelace",
 email: "ada@example.com",
 message: "Hello from CDN",
 },
 })
 .then(({ id, redirectUrl }) => {
 console.log(id, redirectUrl);
 })
 .catch((err) => {
 console.error(err);
 });
</script>
```

Mark classic forms with `data-formsreach` after `FormsReach.init` if you want automatic intercept - see [JavaScript](/docs/frameworks/javascript/).

## When to use HTML instead

Prefer a classic [HTML form POST](/docs/submit-api/html/) when you do not need SPA-style handling and a full page submit is fine.

## Related

- [JavaScript](/docs/frameworks/javascript/)
- [React](/docs/frameworks/react/)
- [Vue](/docs/frameworks/vue/)
- [Submit API overview](/docs/submit-api/overview/)
