Product List

Use the Product List question when you need a list of items with variable quantities per item (like an product order list).

Config

• Required

  At least one option needs to have a quantity greater than zero.

• Title

  The title of the question. You can show the value of other questions by writing {{QA}}, {{QB}}, etc

• Hide Title

  Hide the question title.

• Help Text

  A description text that goes after the question.

• Use images

  Show an image above each option. You can upload images for each option (pre-optimized images work best).

• Add descriptions for each option

  If you need a description text for the options activate it here.

• Options

  Each option has at least a Title and a Value. The value can be used in formulas. Drag an option by the handle on the left side if you need to re-order them.

• Tooltip Text

  A question mark will show after the question with a tooltip text that you can set here.

• Show Values in Email Report

  If you want to send an email to the person submitting the calculator you can chose to show the value of each option in the email.

• Hide Values in Calculator

  You can choose to not show the value for each option in the calculator.

• Min

  Set the minimum value of each option (default is zero).

• Max

  Set the maximum value of each option (default is 100).

• Total Max

  Set the maximum of all the options combined (default is unset, so total maximum is unlimited).

• Default value

  Set the default value of each option (optional).

• Prefix

  Set a prefix, like a currency symbol "$", "€", "£" or any text like "starting at "

• Suffix

  Set a suffix, like " days per week"

• Conditional Visibility

  Set the visibility based on a formula called the Visibility Formula. If the Visibility Formula result is true, the question will be shown in the calculator, otherwise it will be hidden. This allows you to show the question only in certain conditions, for example when another question has a certain value.

• Set value when hidden

  All fields have the value zero when hidden, except for formulas, which keep the same value whether hidden or not.
  Tick this box to set a custom value when hidden, or to keep the same value when hidden as when visible.

Style

Most of the style settings are self-explanatory, but here are a few tips and tricks:

• Colors

  You can set the Question Text Color, Background Color, Help Text color, by using the color picker. The colors use the Hexadecimal code. If you want to reset a color just delete the value.
  Tip: you can set a color to transparent by typing "transparent" in the color box.

• Field Width

  You can set a width for the field (Full width, One half, One third or One fourth). This allows for multiple Questions to sit side by side. Note that on small screen sizes the questions will be reset to full width for usability purposes.

• Align

  Set how the Question content is align. Inline will set the question title and the content on the same line.
  The "Inline Position" setting helps position the Title and the Content:

  • Left - the Title and the Content are both on the left side
  • Middle - the Title and Content are both on the middle of their containers
  • Ends - The Title is on the left and the Content is on the right side

• Add a CSS attribute based on a Formula

  The result of this formula will be added as an attribute to the ".ic-question" parent element of the field/question.

  The attribute is called "formula-attribute", and you can then use it in CSS code to change the way the question looks based on the formula. For example, you could change the background color of the field/question based on a formula.

  For example you could have the "CSS Attribute Formula" be:

  IF(@FormulaField < 10, 'red', 'blue')
  And then in Settings / Design / Custom CSS Code you can add:
  
  .ic-question[formula-field='red'] { background-color: red; }
  .ic-question[formula-field='blue'] { background-color: blue; }
• CSS Class

  Useful for custom CSS/Javascript code. This allows you to change how this particular question looks or works using custom coding.

How it works in Formulas

When referenced in formulas like @ProductListField, it's value is the sum of the Option Quantity * Option Value for each option.

If you want to check a certain option of the product list field you can use the SELECTED function:

This will return the number entered in the second option of the product list field.

This will return a text summary of the selected items in the ProductList field (must have the outer quotes to be evaluated as a string text)