-
Templates
-
Simple Questions
-
Text Entry
-
Date-Time Entry
-
Numeric Entry
-
Color Input
-
Radio Button Group
-
Radio group with Custom Item Template
-
Drop-Down Menu
-
Dropdown: Load Data from Web Services
-
Dropdown with Custom Item Template
-
Dropdown with Lazy Loading
-
Multi-Select Dropdown
-
Checkboxes
-
Carry Forward Responses
-
Image Picker
-
Yes/No Question
-
Signature Pad
-
Multiple Text
-
Rating
-
Ranking
-
Comment
-
Image
-
Html
-
File
-
Expression
-
Expression (using async functions)
-
-
Matrix Table Questions
-
Panel & Dynamic Panel
-
Survey
-
Title and Logo
-
Questions in one line
-
Survey Options
-
Auto-Populate Form Fields
-
Share data between questions
-
Edit saved survey
-
Read-only/display mode
-
Show Preview before complete
-
Pop-Up Survey
-
Context actions in element titles
-
Modify title tags
-
Custom render of survey elements
-
Go next page automatically
-
File - custom preview
-
File - delayed upload
-
Lazy questions rendering
-
-
Quizzes and Scored Surveys
-
Integration with Third-Party Libraries
-
Appearance customization
-
Navigation
-
Conditions and Triggers
-
VisibleIf
-
Simplify Cascade Conditions
-
Complex questions in expressions
-
Use custom function in expressions
-
Create custom condition/expression properties
-
Conditions in dynamic questions
-
Show/Hide choices in radiogroup/checkbox/dropdown
-
Show/Hide individual items in radiogroup/checkbox/dropdown
-
Show/Hide columns/rows in matrix question
-
Show/Hide rows in matrix dropdown question
-
EnableIf
-
Complete Trigger
-
CopyValue Trigger
-
SetValue Trigger
-
Run Expression Trigger
-
-
Text Formatting
-
Survey Localization
-
Input Validation
-
SurveyJS Service
Scored Quiz
Scored quizzes allow you to assign different points or scores to questions, for example, based on difficulty. Individual scores for correct answers are accumulated to calculate a total score and display it to the respondent or save it in a database. You can apply scoring logic to test the knowledge or evaluate performance of a group of people.
To create a scored quiz, you need to create a regular quiz and define scores for each question. Follow the steps below:
Specify the
correctAnswer
property for each question.
This property turns a regular survey question into a quiz question.Implement a custom
score
property.
This property will be serialized and included in the survey JSON schema. The following code shows how to add a numericscore
property to the baseQuestion
class:import { Serializer } from "survey-core"; Serializer.addProperty("question", { name: "score:number" });
For more information on how to add custom properties to a survey element, refer to the following help topic: Add Custom Properties to the Property Grid.
Assign scores to questions.
Set thescore
property of each question to a number.Calculate the total score.
Handle theonComplete
event and use a question'sisAnswerCorrect()
method to check if the question was answered correctly. Sum up the scores of correct answers and display the total score on the Complete page. In addition, you can calculate the maximum possible score. In this demo, theonComplete
event handler calls two helper JavaScript functions that calculate the maximum and total scores.Display different Complete pages based on earned points.
Use thecompleteHtmlOnCondition
array to specify different HTML markup for the Complete page. Each object in this array should include theexpression
andhtml
properties. When theexpression
evaluates totrue
, the survey applies the corresponding markup. For more information on expressions, refer to the Expressions help topic. To use the total and maximum scores in the expression or HTML markup, add them to survey results by calling thesetValue(name, value)
method.
-
Templates
-
Simple Questions
-
Text Entry
-
Date-Time Entry
-
Numeric Entry
-
Color Input
-
Radio Button Group
-
Radio group with Custom Item Template
-
Drop-Down Menu
-
Dropdown: Load Data from Web Services
-
Dropdown with Custom Item Template
-
Dropdown with Lazy Loading
-
Multi-Select Dropdown
-
Checkboxes
-
Carry Forward Responses
-
Image Picker
-
Yes/No Question
-
Signature Pad
-
Multiple Text
-
Rating
-
Ranking
-
Comment
-
Image
-
Html
-
File
-
Expression
-
Expression (using async functions)
-
-
Matrix Table Questions
-
Panel & Dynamic Panel
-
Survey
-
Title and Logo
-
Questions in one line
-
Survey Options
-
Auto-Populate Form Fields
-
Share data between questions
-
Edit saved survey
-
Read-only/display mode
-
Show Preview before complete
-
Pop-Up Survey
-
Context actions in element titles
-
Modify title tags
-
Custom render of survey elements
-
Go next page automatically
-
File - custom preview
-
File - delayed upload
-
Lazy questions rendering
-
-
Quizzes and Scored Surveys
-
Integration with Third-Party Libraries
-
Appearance customization
-
Navigation
-
Conditions and Triggers
-
VisibleIf
-
Simplify Cascade Conditions
-
Complex questions in expressions
-
Use custom function in expressions
-
Create custom condition/expression properties
-
Conditions in dynamic questions
-
Show/Hide choices in radiogroup/checkbox/dropdown
-
Show/Hide individual items in radiogroup/checkbox/dropdown
-
Show/Hide columns/rows in matrix question
-
Show/Hide rows in matrix dropdown question
-
EnableIf
-
Complete Trigger
-
CopyValue Trigger
-
SetValue Trigger
-
Run Expression Trigger
-
-
Text Formatting
-
Survey Localization
-
Input Validation
-
SurveyJS Service