Can I run an NPS survey with Ikiform?

Yes. Use a number field with min 0, max 10 and integer true for the score. The rating type starts at 1, so it doesn't fit a 0 to 10 scale.

How are multiple choice answers stored?

As an array of the chosen option values, with duplicates removed. Only listed values are accepted, and min_items and max_items are checked on the server.

How do I get survey results out?

Export CSV from the dashboard, list submissions with the REST API, or stream each response to a spreadsheet or database by webhook.

Forms

October 24, 20265 fields

Survey form

A short customer survey with single choice, multiple choice and a 0 to 10 recommendation score, stored as typed values you can export to CSV.

Form ID

Preview

Runs Ikiform's validator in your browser. Nothing is sent.

Copy the code

Every version below is generated from the same field definition. Replace frm_xxxxxxxxxxxxxxxx with your form id, or enter it in the Form ID box and the code updates.

survey.html

<form action="https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx" method="post">
  <label for="role">Your role</label>
  <select id="role" name="role" required>
    <option value="">Choose one</option>
    <option value="engineering">Engineering</option>
    <option value="design">Design</option>
    <option value="product">Product</option>
    <option value="marketing">Marketing</option>
    <option value="other">Other</option>
  </select>
  <fieldset>
    <legend>How often do you use it?</legend>
    <label><input type="radio" name="frequency" value="daily" required /> Every day</label>
    <label><input type="radio" name="frequency" value="weekly" required /> Every week</label>
    <label><input type="radio" name="frequency" value="monthly" required /> Every month</label>
    <label><input type="radio" name="frequency" value="rarely" required /> Rarely</label>
  </fieldset>
  <fieldset>
    <legend>Which features do you use most? Pick up to three.</legend>
    <label><input type="checkbox" name="features[]" value="dashboard" /> Dashboard</label>
    <label><input type="checkbox" name="features[]" value="reports" /> Reports</label>
    <label><input type="checkbox" name="features[]" value="integrations" /> Integrations</label>
    <label><input type="checkbox" name="features[]" value="api" /> API</label>
    <label><input type="checkbox" name="features[]" value="mobile" /> Mobile app</label>
  </fieldset>
  <label for="recommend">How likely are you to recommend us, from 0 to 10?</label>
  <input id="recommend" name="recommend" type="number" min="0" max="10" step="1" required />
  <label for="improve">What should we improve?</label>
  <textarea id="improve" name="improve" rows="4" maxlength="4000"></textarea>
  <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden />
  <button>Submit</button>
</form>

HTML needs no JavaScript. After a successful post the browser is redirected to the form's redirect URL, or to Ikiform's hosted thank-you page.
React uses the SDK: npm install @ikiform/sdk. Field errors from the server appear under each field.
JavaScript enhances the HTML form with fetch, so the visitor stays on the page.
The hidden _gotcha input is the honeypot. Leave it empty and hidden.

If you set the form's spam check to Ikiform, the HTML form keeps working with no change and the server action skips the check because it sends a secret key. The React and JavaScript versions must get a token before each submit: call challenge(FORM_ID) from @ikiform/sdk and pass it to submit as turnstileToken, or add it to the fetch body as cf-turnstile-response. Without it the post is refused with 403 challenge_required. See the Next.js guide and Spam protection.

The fields

Paste this definition on the form's Fields tab in the dashboard. Ikiform then checks every post against it on the server, refuses bad data with 422 validation_failed, refuses any field that isn't listed, and stores typed values.

Field id	Type	Required	Accepts
`role`	`select`	Yes	One of: `engineering`, `design`, `product`, `marketing`, `other`
`frequency`	`radio`	Yes	One of: `daily`, `weekly`, `monthly`, `rarely`
`features`	`multi_select`	Yes	Any of: `dashboard`, `reports`, `integrations`, `api`, `mobile`, at most 3
`recommend`	`number`	Yes	0 to 10, whole numbers
`improve`	`textarea`	No	Up to 4,000 characters

Field definition

{
  "version": 1,
  "title": "Customer survey",
  "fields": [
    {
      "id": "role",
      "type": "select",
      "label": "Your role",
      "required": true,
      "options": [
        {
          "value": "engineering",
          "label": "Engineering"
        },
        {
          "value": "design",
          "label": "Design"
        },
        {
          "value": "product",
          "label": "Product"
        },
        {
          "value": "marketing",
          "label": "Marketing"
        },
        {
          "value": "other",
          "label": "Other"
        }
      ]
    },
    {
      "id": "frequency",
      "type": "radio",
      "label": "How often do you use it?",
      "required": true,
      "options": [
        {
          "value": "daily",
          "label": "Every day"
        },
        {
          "value": "weekly",
          "label": "Every week"
        },
        {
          "value": "monthly",
          "label": "Every month"
        },
        {
          "value": "rarely",
          "label": "Rarely"
        }
      ]
    },
    {
      "id": "features",
      "type": "multi_select",
      "label": "Which features do you use most? Pick up to three.",
      "required": true,
      "options": [
        {
          "value": "dashboard",
          "label": "Dashboard"
        },
        {
          "value": "reports",
          "label": "Reports"
        },
        {
          "value": "integrations",
          "label": "Integrations"
        },
        {
          "value": "api",
          "label": "API"
        },
        {
          "value": "mobile",
          "label": "Mobile app"
        }
      ],
      "validation": {
        "max_items": 3
      }
    },
    {
      "id": "recommend",
      "type": "number",
      "label": "How likely are you to recommend us, from 0 to 10?",
      "required": true,
      "validation": {
        "min": 0,
        "max": 10,
        "integer": true
      }
    },
    {
      "id": "improve",
      "type": "textarea",
      "label": "What should we improve?",
      "rows": 4,
      "validation": {
        "max_length": 4000
      }
    }
  ],
  "settings": {
    "submit_label": "Submit",
    "success_message": "Thanks for taking the survey."
  }
}

Next.js server action

To keep the form working without JavaScript in a Next.js app, post from a server action with a secret key. Create the key under API keys with the submissions:write scope and keep it out of the browser.

.env.local

IKIFORM_SECRET_KEY=ik_sk_your_secret_key

app/survey/actions.ts

"use server";

export interface SurveyFormState {
  ok: boolean;
  message: string;
  fields?: Record<string, string[]>;
  values?: Record<string, string[]>;
}

export async function sendSurveyForm(_previous: SurveyFormState, formData: FormData): Promise<SurveyFormState> {
  const body = new URLSearchParams();
  for (const [name, value] of formData) {
    if (typeof value === "string" && !name.startsWith("$ACTION")) body.append(name, value);
  }
  const response = await fetch("https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx", {
    method: "POST",
    headers: {
      Accept: "application/json",
      Authorization: `Bearer ${process.env.IKIFORM_SECRET_KEY}`,
    },
    body,
  });
  const result = await response.json();
  if (result.ok) return { ok: true, message: "Thanks for taking the survey." };
  const values = Object.fromEntries([...new Set(body.keys())].map((name) => [name, body.getAll(name)]));
  return { ok: false, message: result.error.message, fields: result.error.fields, values };
}

app/survey/form.tsx

"use client";

import { useActionState } from "react";
import { type SurveyFormState, sendSurveyForm } from "./actions";

const initial: SurveyFormState = { ok: false, message: "" };

export function SurveyForm() {
  const [state, action, pending] = useActionState(sendSurveyForm, initial);

  if (state.ok) return <p>{state.message}</p>;

  return (
    <form action={action}>
      <label htmlFor="role">Your role</label>
      <select id="role" name="role" required defaultValue={state.values?.role?.[0]}>
        <option value="">Choose one</option>
        <option value="engineering">Engineering</option>
        <option value="design">Design</option>
        <option value="product">Product</option>
        <option value="marketing">Marketing</option>
        <option value="other">Other</option>
      </select>
      {state.fields?.role ? <p>{state.fields.role[0]}</p> : null}
      <fieldset>
        <legend>How often do you use it?</legend>
        <label><input type="radio" name="frequency" value="daily" required defaultChecked={state.values?.frequency?.includes("daily")} /> Every day</label>
        <label><input type="radio" name="frequency" value="weekly" required defaultChecked={state.values?.frequency?.includes("weekly")} /> Every week</label>
        <label><input type="radio" name="frequency" value="monthly" required defaultChecked={state.values?.frequency?.includes("monthly")} /> Every month</label>
        <label><input type="radio" name="frequency" value="rarely" required defaultChecked={state.values?.frequency?.includes("rarely")} /> Rarely</label>
      </fieldset>
      {state.fields?.frequency ? <p>{state.fields.frequency[0]}</p> : null}
      <fieldset>
        <legend>Which features do you use most? Pick up to three.</legend>
        <label><input type="checkbox" name="features[]" value="dashboard" defaultChecked={state.values?.["features[]"]?.includes("dashboard")} /> Dashboard</label>
        <label><input type="checkbox" name="features[]" value="reports" defaultChecked={state.values?.["features[]"]?.includes("reports")} /> Reports</label>
        <label><input type="checkbox" name="features[]" value="integrations" defaultChecked={state.values?.["features[]"]?.includes("integrations")} /> Integrations</label>
        <label><input type="checkbox" name="features[]" value="api" defaultChecked={state.values?.["features[]"]?.includes("api")} /> API</label>
        <label><input type="checkbox" name="features[]" value="mobile" defaultChecked={state.values?.["features[]"]?.includes("mobile")} /> Mobile app</label>
      </fieldset>
      {state.fields?.features ? <p>{state.fields.features[0]}</p> : null}
      <label htmlFor="recommend">How likely are you to recommend us, from 0 to 10?</label>
      <input id="recommend" name="recommend" type="number" min={0} max={10} step={1} required defaultValue={state.values?.recommend?.[0]} />
      {state.fields?.recommend ? <p>{state.fields.recommend[0]}</p> : null}
      <label htmlFor="improve">What should we improve?</label>
      <textarea id="improve" name="improve" rows={4} maxLength={4000} defaultValue={state.values?.improve?.[0]} />
      {state.fields?.improve ? <p>{state.fields.improve[0]}</p> : null}
      <input name="_gotcha" type="text" tabIndex={-1} autoComplete="off" hidden />
      {state.message && !state.fields ? <p role="alert">{state.message}</p> : null}
      <button disabled={pending}>{pending ? "Sending" : "Submit"}</button>
    </form>
  );
}

A server action posts from your server's IP, so the per-visitor rate limit counts every visitor together. Use the Relaxed or Custom rate limit for forms you send through a server.

Set it up

Create a form in the dashboard and copy its id.
Paste the field definition on the Fields tab.
Add your site under Allowed domains, plus localhost while you develop.
Set the rate limit to Standard, 5 a minute per visitor if visitors post from the browser. Each person answers once. Standard is enough; tighten it to Custom only if you see repeat answers. With the server action, every post comes from your server's IP, so choose Relaxed or Custom instead.
Paste the code, send a test and check it arrives in the dashboard.

Multiple choice

features is a multi_select. In HTML its checkboxes are named features[], so even a single choice is stored as an array, like ["api"]. Ikiform removes duplicates, refuses values that aren't listed, and enforces max_items on the server.

Posted	Stored or refused
`features[]=api&features[]=reports`	`["api", "reports"]`
`features[]=api`	`["api"]`
Four features	`Choose at most 3 options`
Nothing	`Choose at least one option`

A 0 to 10 score

The rating type starts at 1, so a recommendation score from 0 to 10 uses a number field with min: 0, max: 10 and integer: true. It is stored as a number. Group 9 and 10 as promoters and 0 to 6 as detractors when you analyse it.

Reading the results

Export responses as CSV from the dashboard, filtered by form and date. See Export.
Or send each response to Google Sheets or Airtable as it arrives and chart it there.
A survey can have up to 100 fields, but every extra question costs answers. Keep it to what you will act on.

Responses aren't anonymous to Ikiform: each one records the user agent, origin, referrer and country. The visitor's IP is stored only as a hash and never returned by the API.

Where to send it

Every submission can go to a signed webhook. These guides cover the tools that suit this form, with the relay code:

Questions

Point your form at Ikiform

Get started Read the docs