Feedback 1 step · 9 fields

Event feedback

Overall rating, best session, highlights, what to change and whether people would come again.

Launch for free

Get a hosted link and a responses inbox in a minute. No backend, no credit card.

Or set it up yourself

Live preview

Form definition JSON · 96 lines

{  "id": "event-feedback",  "title": "Event feedback",  "submit": { "label": "Send feedback" },  "fields": [    {      "key": "rating",      "type": "radio",      "label": "How would you rate the event overall?",      "layout": "inline",      "helperText": "1 is poor, 5 is excellent.",      "options": [        { "value": "1", "label": "1" },        { "value": "2", "label": "2" },        { "value": "3", "label": "3" },        { "value": "4", "label": "4" },        { "value": "5", "label": "5" }      ],      "validation": { "required": true }    },    {      "key": "attended",      "type": "radio",      "label": "How did you attend?",      "layout": "inline",      "options": [        { "value": "in-person", "label": "In person" },        { "value": "online", "label": "Online" }      ],      "validation": { "required": true }    },    {      "key": "venueRating",      "type": "radio",      "label": "How would you rate the venue, food and drinks?",      "layout": "inline",      "helperText": "1 is poor, 5 is excellent.",      "show": [{ "field": "attended", "eq": "in-person" }],      "options": [        { "value": "1", "label": "1" },        { "value": "2", "label": "2" },        { "value": "3", "label": "3" },        { "value": "4", "label": "4" },        { "value": "5", "label": "5" }      ]    },    {      "key": "highlights",      "type": "multiselect",      "label": "What did you enjoy most?",      "helperText": "Pick all that apply.",      "options": [        { "value": "talks", "label": "Talks" },        { "value": "workshops", "label": "Workshops" },        { "value": "networking", "label": "Networking" },        { "value": "organization", "label": "Organization" },        { "value": "other", "label": "Something else" }      ]    },    {      "key": "bestSession",      "type": "text",      "label": "Which session was most useful?"    },    {      "key": "change",      "type": "textarea",      "label": "What should we change next time?",      "rows": 3    },    {      "key": "return",      "type": "radio",      "label": "Would you come again?",      "layout": "inline",      "options": [        { "value": "yes", "label": "Yes" },        { "value": "maybe", "label": "Maybe" },        { "value": "no", "label": "No" }      ]    },    {      "key": "updates",      "type": "checkbox",      "label": "Tell me about future events"    },    {      "key": "email",      "type": "email",      "label": "Email",      "inputMode": "email",      "validation": { "required": true },      "show": [{ "field": "updates", "eq": true }]    }  ]}

Use it with the npm packages

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/react

tsx

import { 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.

Event feedback

Use it with the npm packages ​

Use it with the npm packages