Use calculated values


                        
        
            Survey.StylesManager.applyTheme("defaultV2");
        



                
                    var json = {
pages: [
    {
    name: "page1",
    elements: [
        {
        type: "text",
        name: "firstname",
        title: "Please type your First Name",
        isRequired: true
        },
        {
        type: "text",
        name: "lastname",
        startWithNewLine: false,
        title: "Last Name",
        isRequired: true
        },
        {
        type: "text",
        name: "birthdate",
        title: "Please type your Birth date:",
        isRequired: true,
        validators: [
            {
            type: "expression",
            text: "You should be 14 years old or older",
            expression: "{age} > 13"
            },
            {
            type: "expression",
            text: "You should be 90 years old or younger",
            expression: "{age} <= 90"
            }
        ],
        inputType: "date"
        }
    ]
    },
    {
    name: "page2",
    elements: [
        {
        type: "checkbox",
        name: "options",
        title:
            "Dear {fullname}. Based on your age ({age}), we can recommend you the following options. Please choose at least one:",
        isRequired: true,
        choices: [
            {
            value: "option 1",
            text: "Option 1, age < 18",
            visibleIf: "{age} < 18"
            },
            {
            value: "option 2",
            text: "Option 2, age < 18",
            visibleIf: "{age} < 18"
            },
            {
            value: "option 3",
            text: "Option 3, age < 18",
            visibleIf: "{age} < 18"
            },
            {
            value: "option 4",
            text: "Option 4, age >= 18 and age < 50",
            visibleIf: "{age} >= 18 and {age} < 50"
            },
            {
            value: "option 5",
            text: "Option 5, age >= 18 and age < 50",
            visibleIf: "{age} >= 18 and {age} < 50"
            },
            {
            value: "option 6",
            text: "Option 6, age >= 18 and age < 50",
            visibleIf: "{age} >= 18 and {age} < 50"
            },
            {
            value: "option 7",
            text: "Option 7, age >= 50",
            visibleIf: "{age} >= 50"
            },
            {
            value: "option 8",
            text: "Option 8, age >= 50",
            visibleIf: "{age} >= 50"
            },
            {
            value: "option 9",
            text: "Option 9, age >= 50",
            visibleIf: "{age} >= 50"
            }
        ]
        }
    ]
    }
  ],
  calculatedValues: [
      {
        name: "fullname",
        expression: "{firstname} + ', ' + {lastname}"
      },
      {
        name: "age",
        expression: "age({birthdate})",
        includeIntoResult: true
      }
  ]
};

                    window.survey = new Survey.Model(json);
                
        
            survey.onComplete.add(function(sender) {
            document.querySelector('#surveyResult').textContent =
            "Result JSON:\n" + JSON.stringify(sender.data, null, 3);
            });
        
        
            $("#surveyElement").Survey({
            model: survey 
            });
        

                    
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Use calculated values, jQuery Survey Library Example</title>
    
<meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/jquery"></script>
    <script src="/DevBuilds/survey-jquery/survey.jquery.min.js"></script>
    <link href="/DevBuilds/survey-core/defaultV2.min.css" type="text/css" rel="stylesheet" />
    <link rel="stylesheet" href="./index.css">

</head>
<body style="margin: 0">
    
            <div id="surveyElement" style="display:inline-block;width:100%;">
                            </div>
    <div id="surveyResult"></div>

<script type="text/javascript" src="./index.js"></script>

</body>
</html>
Loading...
Sorry, we can't retrieve the data from server. Please comeback later.
Settings

Text processing doesn't support expressions. To deal with it and to allow keep complex expressions simple, we have introduced Calculated Values in version 1.1.8. Survey class has calculatedValues property, that contains the list of Calculated Value.

CalculatedValue class has 3 properties: name, expression and a boolean property includeIntoResult (false by default). Here is the example of calculated value JSON definition:

{name: "age", expression: "age({birthdate})", includeIntoResult: true}
When the question bithdate is changed, the calculated value is automatically updated it's value (read-only property).

Why we use cookies.

This site uses cookies to make your browsing experience more convenient and personal. Cookies store useful information on your computer to help us improve the efficiency and relevance of our site for you. In some cases, they are essential to making the site work properly. By accessing this site, you consent to the use of cookies.

For more information, refer to DevSoft Baltic’ privacy policy and cookie policy.