NPS Survey Question


                        



const options = { showLogicTab: true };            
                var creator = new SurveyCreator.SurveyCreator(options);
            
                
                    ReactDOM.render(
                    <React.StrictMode>
                        <SurveyCreator.SurveyCreatorComponent creator={creator} />
                    </React.StrictMode>,
                    document.getElementById("creatorElement")
                    );
                
creator.JSON = {
 "completedHtml": "<h3>Thank you for your feedback.</h3><h5>Your thoughts and ideas will help us to create a great product!</h5>",
 "completedHtmlOnCondition": [
  {
   "expression": "{nps_score} > 8",
   "html": "<h3>Thank you for your feedback.</h3><h5>We glad that you love our product. Your ideas and suggestions will help us to make our product even better!</h5>"
  },
  {
   "expression": "{nps_score} < 7",
   "html": "<h3>Thank you for your feedback.</h3><h5> We are glad that you share with us your ideas.We highly value all suggestions from our customers. We do our best to improve the product and reach your expectation.</h5><br />"
  }
 ],
 "pages": [
  {
   "name": "page1",
   "elements": [
    {
     "type": "rating",
     "name": "nps_score",
     "title": "On a scale of zero to ten, how likely are you to recommend our product to a friend or colleague?",
     "isRequired": true,
     "rateMin": 0,
     "rateMax": 10,
     "minRateDescription": "(Most unlikely)",
     "maxRateDescription": "(Most likely)"
    },
    {
     "type": "checkbox",
     "name": "promoter_features",
     "visible": false,
     "visibleIf": "{nps_score} >= 9",
     "title": "Which features do you value the most?",
     "isRequired": true,
     "validators": [
      {
       "type": "answercount",
       "text": "Please select two features maximum.",
       "maxCount": 2
      }
     ],
     "choices": [
      "Performance",
      "Stability",
      "User Interface",
      "Complete Functionality"
     ],
     "showOtherItem": true,
     "otherText": "Other feature:",
     "colCount": 2
    },
    {
     "type": "comment",
     "name": "passive_experience",
     "visible": false,
     "visibleIf": "{nps_score} > 6  and {nps_score} < 9",
     "title": "What do you like about our product?"
    },
    {
     "type": "comment",
     "name": "disappointed_experience",
     "visible": false,
     "visibleIf": "{nps_score} notempty",
     "title": "What do you miss or find disappointing in your experience with our products?"
    }
   ]
  }
 ],
 "showQuestionNumbers": "off"
};
                    
<!DOCTYPE html>
<html lang="en">
<head>
    <title>NPS Survey Question, Survey Creator Example</title>
    
<meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/react@17.0.1/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/react-dom@17.0.1/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/@babel/standalone@7.2.5/babel.min.js"></script>
    <script src="/DevBuilds/survey-core/survey.core.min.js"></script>
    <script src="/DevBuilds/survey-core/survey.i18n.min.js"></script>
    <script src="/DevBuilds/survey-react-ui/survey-react-ui.min.js"></script>
    <link href="/DevBuilds/survey-core/defaultV2.min.css" type="text/css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.10/ace.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.10/ext-language_tools.js" type="text/javascript" charset="utf-8"></script>
        <script src="/DevBuilds/survey-creator-core/survey-creator-core.min.js"></script>
        <link href="/DevBuilds/survey-creator-core/survey-creator-core.min.css" type="text/css" rel="stylesheet" />
        <script src="/DevBuilds/survey-creator-core/survey-creator-core.i18n.min.js"></script>
        <script src="/DevBuilds/survey-creator-react/survey-creator-react.min.js"></script>
        <style>
            :root {
                --tab-min-height: 600px;
            }
        </style>
    <link rel="stylesheet" href="./index.css">

</head>
<body style="margin: 0">
    
<div id="surveyContainer">
            <div id="creatorElement" style="height: 100vh;"></div>
</div>

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

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

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.