Aabraforms

DOCS

Get started in 3 steps.

1. Create a form

Sign in and create a form from your dashboard. You'll get a unique endpoint URL that looks like this:

https://abraforms.com/f/abc123xyz

2. Point your form at it

Any HTML form can submit to an abraforms endpoint. Set the action attribute and you're done.

HTML
<form action="https://abraforms.com/f/abc123xyz" method="POST">
  <input name="email" type="email" required />
  <input name="name" type="text" />
  <textarea name="message" required></textarea>

  <!-- Honeypot: hide this field with CSS -->
  <input type="text" name="_gotcha" style="display:none" />

  <button type="submit">Send</button>
</form>

3. Submit via fetch (AJAX)

Prefer to handle the response yourself? Send JSON with Accept: application/json and abraforms returns JSON instead of redirecting.

JavaScript
const res = await fetch("https://abraforms.com/f/abc123xyz", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "Accept": "application/json",
  },
  body: JSON.stringify({
    email: "hello@example.com",
    message: "Loving the app!",
  }),
});

const { ok } = await res.json();

React Hook Form

React
import { useForm } from "react-hook-form";

function Contact() {
  const { register, handleSubmit } = useForm();

  const onSubmit = async (data) => {
    await fetch("https://abraforms.com/f/abc123xyz", {
      method: "POST",
      headers: { "Content-Type": "application/json", Accept: "application/json" },
      body: JSON.stringify(data),
    });
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register("email")} />
      <textarea {...register("message")} />
      <button>Send</button>
    </form>
  );
}

Special fields