SurveyJS – Learn how to create easy surveys

As background story, I finished university with a graduation project for a company, which you can find it here. The goal was to do something similar to Google Forms integrated with an ISO 9001 document management system, so I needed a good library to build surveys. It had to meet the following requirements:

  • Good Documentation
  • JSON-based library
  • Custom CSS
  • Send data to a server or at least provided a method

After intensive research, I encountered many libraries but they didn’t meet at least one requirement, except for SurveyJS. It has complete documentation with examples and provided helper methods to get data, therefore I decided to use it. After finishing the project, I thought it would nice to post the implementation applied to a production project, so let’s get started!

What is SurveyJS?

SurveyJS is a JSON-based javascript library that allows you to have full control of its use. You can modify the main object with additional functionality, send and receive data to a server at any moment, and the best part is that it is based on JSON! It’s even compatible with different javascript frameworks and libraries like React, Angular, JQuery, and Vue.

How do I use it?

In simple words, we will just need to create a simple structured object the way SurveyJS wants. The implementation I have includes the follow: integration with MongoDB simple methods to manage the data, and using SurveyJS jQuery library.

In the code below, there’s schema we will be using in the project. Most of the variables are self-explanatory and required by my project, but I want to focus on the questions array.

'use strict' var mongoose = require('mongoose'); let schema = new mongoose.Schema({ surveyName: String, business: [String], department: String, period: { start: Date, end: Date }, responsible: String, clients: [String], questions: [{ name: String, title: String, formType: String, isRequired: Boolean, inputType: String, choices: [String], clients: [String], service: String, mininumRateDescription: String, maximumRateDescription: String, choicesValue: [{ name: String, value: Number }], rateValues: [Number], showChoices: Boolean, created: Date }], uniqueResponses: Boolean, finalGrade: Number, active: Boolean, general: Boolean, created: Date }) module.exports = mongoose.model('Survey', schema); Read more...