Open-Source Form Builder for your Enterprise.
SurveyJS Form Builder is an open-source client-side component that fully integrates into your JS application. It automatically generates form JSON definitions (schemas) in real time.
Integrate with just a few lines of code
SurveyJS Form Builder and its rendering components are distributed as npm packages and as scripts and style sheets that you can reference on your page.
Select your frontend and see how little code is needed to embed the form builder in your app.
import { Component, OnInit } from '@angular/core';
import { SurveyCreatorModel } from "survey-creator-core";
@Component({
// ...
})
export class SurveyCreatorComponent implements OnInit {
surveyCreatorModel: SurveyCreatorModel;
ngOnInit() {
const creator = new SurveyCreatorModel(creatorOptions);
this.surveyCreatorModel = creator;
}
}
//-----------------------------------------------------------------
// <div id="surveyCreator">
// <survey-creator [model]="surveyCreatorModel"></svc-creator>
// </div>
//-----------------------------------------------------------------import { SurveyCreator, SurveyCreatorComponent } from "survey-creator-react";
import "survey-core/survey-core.min.css";
import "survey-creator-core/survey-creator-core.min.css";
const creatorOptions = {
// ...
};
export function SurveyCreatorWidget() {
const creator = new SurveyCreator(creatorOptions);
return <SurveyCreatorComponent creator={creator} />;
}<template>
<div id="surveyCreator" />
</template>
<script>
import { SurveyCreator } from "survey-creator-knockout";
import "survey-core/survey-core.min.css";
import "survey-creator-core/survey-creator-core.min.css";
const creatorOptions = {
autoSaveEnabled: true
};
export default {
name: "survey-creator",
mounted() {
const creator = new SurveyCreator(creatorOptions);
creator.render("surveyCreator");
}
};
</script>const creatorOptions = {
// ...
};
const creator = new SurveyCreator.SurveyCreator(creatorOptions);
document.addEventListener("DOMContentLoaded", function () {
creator.render("surveyCreator");
});const creatorOptions = {
// ...
};
const creator = new SurveyCreator.SurveyCreator(creatorOptions);
document.addEventListener("DOMContentLoaded", function () {
creator.render("surveyCreator");
});Get started with SurveyJS today and enjoy an industry-leading survey experience.
Benefits of a self-hosted form builderover online survey platforms.
SurveyJS form builder is 100% open-source which gives you unparalleled flexibility and customization options. You have complete control not merely over the look and feel of your forms, but the functionality of the form builder itself.
You have total control of the data flow between server and client without any third-party involved.
It is more cost-effective in the long run as you only pay for a developer license, which is perpetual.
You can ensure individual privacy and legal compliance.
You can scale it as needed to meet the changing needs of your organization.
Your self-hosted form builder can deliver better performance and faster form load times as it's not subjected to 3-rd party performance limitations.
SurveyJS Form Builder features a feature-rich theme design tool that empowers you to create unique survey looks tailored to your application.
JSON as Common Ground
We use the industry-standard JSON format to define a form as a data model. Whenever your end user drags a form element onto the design surface and applies various form settings, the form builder automatically generates its definition (schema) in JSON. These JSON schemas contain key-value pairs that represent various aspects of a form, including its style, descriptions of each input field, form layout, UI controls, and behavioral instructions in response to user interactions. The SurveyJS Form Library parses these JSON objects and dynamically generates the corresponding HTML elements, rendering them on a web page.
CSS Theme Editor
Survey Creator ships with a Theme Editor—an intuitive platform with a set of UI controls for designing surveys and forms that captivate, engage and align with your brand's identity. We’ve prepared a gallery of predefined themes for you to kickstart. As you tweak colors, adjust fonts, or experiment with layouts, every change is instantly visible. You can save your customized themes in JSON format and reuse them across your surveys, ensuring consistency.
Unprecedented Flexibility
We've made sure the Creator UI is fully customizable and allows adjustment based on your needs and preferences:
Сustomize the Toolbox—add new form elements, remove existing ones, rearrange their order, group them into categories, or add custom icons or descriptions to give more context to users. You can modify it in any way required to provide form creators with quick access to the elements they use most frequently.
Customize the overall form builder UI—hide unwanted UI tabs and buttons, or add your own custom ones.
Customize the Property Grid—limit available settings or add new ones, remove unpopular functionality, add custom tooltips or property names, and more.
User Access Control and Form Management UI
Our form builder seamlessly integrates with any user management system, allowing you to assign different roles (e.g., admin, editor, viewer) to users and control their permissions accordingly. You also have an option to implement a form management UI where admins and form creators can easily access available forms and perform various CRUD operations.
White-Labeled
The SurveyJS form builder integrates seamlessly into any website or application (including SaaS) without compromising its brand image. You can customize and brand the form builder interface with your own branding elements, such as logos, colors, and company information.
Free Full-Scale Demo
We know how important it is to try a product before deciding to incorporate it into your end user workflow. For this reason, we developed a free full-featured demo that illustrates the capabilities of the form builder and allows you estimate its potential value in your project(s).
These are some features of the Survey Creator library.
Drag
to rank them in terms of your priority.
Still got questions?
Check our FAQ or Contact Us