Set Max Answers to Checkbox Question Dynamically Based on Previous Question Answer

Important Update to Custom Scripting

SurveyGizmo's CustomScript Action now supports the LUA programming language. Visit our NEW Lua Scripting Resources!

Legacy Custom Scripting Language Deprecation Plans 

  1. New accounts (created after October 29, 2018) will only have the option to use Lua in scripts.
  2. As of October 29, 2018 Custom Scripting Actions will default to Lua as the scripting type in the Custom Scripting Action for accounts created before this date. You will be able to switch to the Legacy Custom Scripting; though we highly encourage using Lua.
  3. In the long term, Legacy Custom Scripting Actions will be switched to read-only. The exact date on this is to be determined; we will send notifications well ahead of time.

Often survey builders wish to set the maximum answers a respondent can provide to a checkbox question dynamically based on the value entered in a previous Textbox question. You can achieve this, both for Checkbox questions on the same page and later pages, with a little bit of JavaScript. 

Check it out in an example survey!

OR

Add a survey with this setup to your account!

This script uses the following question types or actions:

  1. To get started create a Textbox question where you will collect the value that you will use in the maximum answers validation for the Checkbox question.
  2. Next, create your Checkbox question. The questions can be on the same page or different pages.
  3. Add a JavaScript action to the page with your Checkbox question.
  4. Copy and paste one of the below scripts; there is one for when the Textbox and Checkbox questions are on the same page and one for when they are on different pages.

Script for when Textbox and Checkbox questions are on the same page:


$(document).ready(function(){
 
  var maxans;
 
  $(".max :text").blur(function(){
    maxans = $(this).val();
  });
 
  $(".checkboxQuestion").change(function(){
    var checked = $(".checkboxQuestion :checkbox:checked").length;
    if (checked == maxans) {
      $(".checkboxQuestion :checkbox:not(:checked)").attr("disabled",true);
    }
   
    if (checked < maxans) {
      $(".checkboxQuestion :checkbox").attr("disabled",false);
    }
  });
});

Once you have added the JavaScript to the page with your Checkbox question you need to add the CSS Class Names to each of the questions you wish to apply this script to.

  • checkboxQuestion should be added to the Checkbox question
  • max should be added to the Textbox question.

These classes should be added to the CSS Class Name field on the Layout tab of each question.

Script for when the Checkbox question is on a later page:


$(document).ready(function(){
 
  var maxans = '[question("value"), id="5"]'; //update id with ID of of checkbox question
 
  $(".checkboxQuestion").change(function(){
    var checked = $(".checkboxQuestion :checkbox:checked").length;
    if (checked == maxans) {
      $(".checkboxQuestion :checkbox:not(:checked)").attr("disabled",true);
    }
   
    if (checked < maxans) {
      $(".checkboxQuestion :checkbox").attr("disabled",false);
    }
  });
});

Once you have added the JavaScript to the page with your Checkbox question you will need to change the ID in the script to the ID of your checkbox question. Learn How to Find Question IDs

Scripting and Other Custom Solutions

We’re always happy to help you debug any documented script that is used as is. That said, we do not have the resources to write scripts on demand or to debug a customized script.

If you have customization ideas that you haven't figured out how to tackle, we're happy to be a sounding board for SurveyGizmo features and functionality ideas that might meet your customization. Beyond this, you might want to consult with someone on our Programming Services Team; these folks might have the scripting chops to help you to achieve what you are looking for!