SurveyJS + Blazor + Vanilla JS Quickstart Template

SurveyJS is a set of JavaScript components that allow you and your users to build surveys / forms, store them in your database, and visualize survey results for data analysis. This quick start template shows how to integrate the following SurveyJS components into a Blazor application without using any front-end framework:

• SurveyJS Form Library
• Survey Creator / Form Builder
• SurveyJS PDF Generator
• SurveyJS Dashboard

SurveyJS also supports integrations with React, Angular, Vue 3, and jQuery. Refer to the following repository for an example with React: SurveyJS + Blazor + React Quickstart Template.

Run the application

git clone https://github.com/surveyjs/surveyjs-blazor-vanillajs.git
cd surveyjs-blazor-vanillajs
dotnet run

Open http://localhost:5008/ in your web browser.

NOTE: This application uses .NET 8.0. Make sure that you have ASP.NET Core Runtime 8.0 installed on your machine.

Template structure

This template covers most basic use cases. You can find code examples for them in the following files:

• Create a standalone survey
  • wwwroot/data/survey_json.js
  • wwwroot/js/survey.js
  • Components/Pages/FormLibrary.razor
• Add Survey Creator to a page
  • wwwroot/js/creator.js
  • Components/Pages/Creator.razor
• Export a survey to a PDF document
  • wwwroot/js/pdf-generator.js
  • Components/Pages/Pdf.razor
• Visualize survey results
  • As charts
    • wwwroot/data/dashboard_json.js
    • wwwroot/data/survey_data.js
    • wwwroot/js/dashboard.js
    • Components/Pages/Dashboard.razor
  • As a table
    • wwwroot/data/dashboard_json.js
    • wwwroot/data/survey_data.js
    • wwwroot/js/tabulator.js
    • Components/Pages/Table.razor

How to integrate SurveyJS components into your Blazor application

Refer to the following SurveyJS help topics:

• Form Library
• Survey Creator / Form Builder
• Dashboard
• Table View for Survey Results
• PDF Generator

SurveyJS Resources

• Website
• Documentation
• Starter Demos
• What's New