<!DOCTYPE html>
<html>
<head>
<title>My First Survey</title>
<meta charset="utf-8">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Modern theme -->
<link href="https://unpkg.com/survey-jquery/modern.min.css" type="text/css" rel="stylesheet">
<!-- Default theme -->
<!-- <link href="https://unpkg.com/survey-jquery/survey.min.css" type="text/css" rel="stylesheet"> -->
<!-- Bootstrap theme -->
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet"> -->
<script type="text/javascript" src="https://unpkg.com/survey-jquery/survey.jquery.min.js"></script>
<script type="text/javascript" src="index.js"></script>
</head>
<body>
<div id="surveyContainer"></div>
</body>
</html>
Survey
.StylesManager
.applyTheme("modern");
const surveyJson = {
questions: [{
name: "FirstName",
title: "Enter your first name:",
type: "text"
}, {
name: "LastName",
title: "Enter your last name:",
type: "text"
}]
};
const survey = new Survey.Model(surveyJson);
function alertResults (sender) {
const results = JSON.stringify(sender.data);
alert(results);
}
survey.onComplete.add(alertResults);
$(function() {
$("#surveyContainer").Survey({ model: survey });
});