Feedback 1 step · 9 fields
Why customers leave, with follow-ups for price, missing features, usability and switching to a competitor.
Get a hosted link and a responses inbox in a minute. No backend, no credit card.
Or set it up yourself
Live preview
{ "id": "cancellation-survey", "title": "Before you go", "submit": { "label": "Send and cancel" }, "fields": [ { "key": "reason", "type": "radio", "label": "What’s the main reason you’re canceling?", "options": [ { "value": "price", "label": "It’s too expensive" }, { "value": "missing-feature", "label": "It’s missing something I need" }, { "value": "hard-to-use", "label": "It’s hard to use" }, { "value": "quality", "label": "Bugs or reliability problems" }, { "value": "support", "label": "I wasn’t happy with support" }, { "value": "switching", "label": "I’m switching to another product" }, { "value": "no-need", "label": "I don’t need it anymore" }, { "value": "other", "label": "Other" } ], "validation": { "required": true } }, { "key": "feature", "type": "text", "label": "What was missing?", "show": [{ "field": "reason", "eq": "missing-feature" }] }, { "key": "hardPart", "type": "text", "label": "What was hard to use?", "show": [{ "field": "reason", "eq": "hard-to-use" }] }, { "key": "competitor", "type": "text", "label": "Which product are you moving to?", "show": [{ "field": "reason", "eq": "switching" }] }, { "key": "fairPrice", "type": "text", "label": "What price would have felt fair?", "placeholder": "$ per month", "show": [{ "field": "reason", "eq": "price" }] }, { "key": "reasonOther", "type": "text", "label": "What’s the reason?", "show": [{ "field": "reason", "eq": "other" }], "validation": { "required": true } }, { "key": "return", "type": "radio", "label": "Would you consider coming back?", "layout": "inline", "options": [ { "value": "yes", "label": "Yes" }, { "value": "maybe", "label": "Maybe" }, { "value": "no", "label": "No" } ], "validation": { "required": true } }, { "key": "anything", "type": "textarea", "label": "Anything else we should know?", "rows": 3 }, { "key": "followUp", "type": "checkbox", "label": "You can email me about my answers" } ]}Copy the JSON into a file in your app, install the renderer and pass the definition to it. The same JSON works with @formhaus/vue.
npm i @formhaus/core @formhaus/reactimport { FormRenderer } from '@formhaus/react';
import '@formhaus/core/style.css';
import definition from './form.json';
export function Form() {
return (
<FormRenderer
definition={definition}
onSubmit={(values) => console.log(values)}
/>
);
}See Getting started for validation, steps and custom components.