Numeric: Progressive Reveal

This article will help you create a Numeric question using a Progressive Reveal


Numeric Progressive Reveal

This code will allow you to use a Numeric question type which will show your one attribute at a time. The next item will appear after you answer the current one.  

Click here to see an example


Instructions

  1. Add a Numeric question type to your survey with all of the appropriate 
    1. See article: Add a Question: Numeric Fields
  2. Add the code below to your 'ADD JAVASCRIPT'
    1. See article: Adding JavaScript and/or CSS to a Question
    2. Make sure to update the 'Q6' with your specific question number
      var $ = jQuery,
          q = $("[data-qnum='Q6']");
      
      // SHOW ONE AT A TIME
      q.find(".cm-numeric-input").keyup(function() {
        var target = $(this).parents("li");
        if ( $(this).val() !== "" ) {
          target.next().show();
        }
        else {
          target.nextAll().hide().find(".cm-numeric-input").val("");
        }
      });
      
      		
  3. Add the code below to your 'ADD CSS' 
    1. See article: Adding JavaScript and/or CSS to a Question
      /* HIDES PROGRESSIVE REVEAL AS NEEDED */
      .cm-numeric-response-set li:not(:first-child) {
      	display: none;
      }
      	
  4. You may have to modify your question settings based on your needs.
  5. As always, make sure to test
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us