Questionnaire

H5P equivalent

H5P Questionnaire

When to use

Use Questionnaire for multi-field surveys — exit tickets, needs analysis, or qualitative feedback with several text/textarea fields.

Emits questionnaire_submitted when tracking is enabled; not auto-scored.

Try it

Documentation demo

Use the Live demo, React, AI prompt, and Packaging / Manifest tabs below. Embedded demos disable telemetry, xAPI, and the LMS bridge. For production delivery, use the CLI template src/courseConfig.ts and LMS Go-Live.

Open demo in full tab 

<Questionnaire
  blockId="exit-survey"
  fields={[
    { id: "role", label: "Your role", type: "text" },
    { id: "confidence", label: "Confidence spotting phishing (1–5)", type: "text" },
    { id: "feedback", label: "What was most useful?", type: "textarea" },
  ]}
/>

Copy into Cursor, Copilot, or ChatGPT after the vibe coding starter context:

Read lessonkit.json and src/App.tsx before editing.

Add a Questionnaire block (H5P-style: Questionnaire) like this example inside the active <Lesson>:

<Questionnaire
  blockId="exit-survey"
  fields={[
    { id: "role", label: "Your role", type: "text" },
    { id: "confidence", label: "Confidence spotting phishing (1–5)", type: "text" },
    { id: "feedback", label: "What was most useful?", type: "textarea" },
  ]}
/>

Requirements:
- Import only from @lessonkit/react; use block types from block-catalog.v3.json.
- Keep existing courseId, lessonId, and navigation stable unless I ask to add a lesson.
- After edits, list changed files and what to verify in the browser (lessonkit dev).

Workflow tips: https://lessonkit.readthedocs.io/en/latest/guides/vibe-coding/prompting-and-workflows.html

Touch behavior

Submit uses lk-button. Text inputs inherit the global 16px minimum font size on [data-lk-check-id] fields to prevent iOS focus zoom.

See also