Javascript

Javascript documentation for the Modern 2.0 template

Overview

The Modern 2.0 template now contains a list of variables that you can make changes to update look and behaviour of Modern 2.0.

You can see the list of options you can chance and their default value in the following list:

Basic options

Enlarges the table by opening it in a full screen dialogOpen

Modern checkbox

Description:
Modern and animated checkbox

Value:
true or false

Default value:
true

Full code:

var checkBoxModernFixOption = true;

Flex buttons

Description:
Make buttons inside the form always use the full width of the page, even when in 2 rows

Value:
true or false

Default value:
false

Full code:

var flexButtonsOption = false;

Hide headings

Description:
Hides the input type “heading” from the form, usefull in quiz format

Value:
true or false

Default value:
true

Full code:

var hideFormHeadingsOption = true;

Show Quiz Steps

Description:
Show the current page and total pages when in quiz mode

Value:
true or false

Default value:
false

Full code:

var showQuizStepsOption = false;

Hide the back button

Description:
Hides the back button when in quiz mode

Value:
true or false

Default value:
true

Full code:

var hideQuizBackButtonOption = true;

Modern radio buttons

Description:
Modern and animated radio buttons

Value:
true or false

Default value:
true

Full code:

var modernInlineRadioOption = true;

Modern radio images

Description:
Modern and radio image buttons

Value:
true or false

Default value:
true

Full code:

var modernRadioImagesOption = true;

Modern quantity:

Description:
Modern and updated quantity input fields

Value:
true or false

Default value:
true

Full code:

var modernQuantityOption = true;

Modern quantity images

Description:
Modern and updated quantity image fields

Value:
true or false

Default value:
true

Full code:

var modernQuantityImageOption = true;

Date picker options

Modern datepicker

Description:
Enables the modern datepicker, all other datepicker options requires this to be true to work

Value:
true or false

Default value:
true

Full code:

var datePickerModernFixEnabledOption = true;

Date picker language

Description:
Changes to language from english. Only Danish and English is supported for now

Value:
use "dk" for Danish or leave empty for English

Default value:
""

Full code:

var datePickerModernFixLanguageOption = ""; // "dk" for Danish, else English

Month selector

Description:
Adds a dropdown menu to change month

Value:
true or false

Default value:
false

Full code:

var datePickerChangeMonthOption = false;

Year selector

Description:
Adds a dropdown to select year

Value:
true or false

Default value:
false

Full code:

var datePickerChangeYearOption = false;

Year range

Description:
Limit the datepicker to a range of years

Value:
Range example: "2020:2025"

Default value:
""

Full code:

var datePickerYearRangeOption = ""; //Range example: "2020:2025"

Input fields with legend options

Modern Input Label Legends

Description:
Uses the label as both placeholder and title of an input field

Value:
true or false

Default value:
true

Full code:

var modernInputLabelLegendsEnabledOption = true;

Legend Background

Description:
Adds a colored background to the legend,

Value:
true or false

Default value:
false

Full code:

var modernInputLabelLegendsDarkBgOption = false;

Quantity group options

Group Quantities

Description:
Groups all Quantities that are next to eachother. Quantity Group options requires this to be true to work

Value:
true or false

Default value:
true

Full code:

var modernQuantityGroupEnabledOption = true;

Group Align Center

Description:
Centers the Quantitity group elements

Value:
true or false

Default value:
true

Full code:

var modernQuantityGroupedAlignCenterUngroupedOption = true; //Only works if quantity are grouped

File upload options

Modern File Upload

Description:
Enable Modern Fileupload with Drag and Drop functionalities

Value:
true or false

Default value:
true

Full code:

var modernFileUploadEnabledOption = true;

Modern File Upload Language

Description:
Changes to language from english. Only Danish and English is supported for now

Value:
use "dk" for Danish or leave empty for English

Default value:
""

Full code:

var modernFileUploadLanguageOption = ""; // "dk" for Danish, else English

Change an option

If you want to change one of the options you simply copy the whole line of the option, go into your calculator, click on “Insert custom HTML” in the menu to the right:

After that, click on “Analytics Code” in the popup box:

Find the following area:

And simply add your copied option and update it to reflect the change you wish to make and press the “Save” button: