Next Page Button: Hide Button for Time Interval
This article will show you how to display the Next Page button after a set amount of time
Hide Next Page Button for a Specific Time Interval
You may want to display the Next Page button after a specific amount of time. This can be done so that a respondent is forced to review a concept for at least 10 seconds, for example.
Follow the steps below to set this up:
- Add the question(s) needed onto the page
- Within a question on that page, click on 'ADD JAVASCRIPT'
- Add the code below and update the first line to have the amount of seconds. The next page button will appear after the set amount of time as elapsed and the Next button can be used.
var hideInterval = 10 /* UPDATE SECONDS TO BE WHAT YOU NEED */ var functionCall = setInterval(timerUpdate, 1000); cmSurvey.hideNextButton(true); jQuery("#cm-NextButton").css("width", "7em"); function timerUpdate() { jQuery("#cm-NextButton").addClass("disabledButton").html(hideInterval); hideInterval -= 1; if (hideInterval < 0) { clearInterval(functionCall); jQuery("#cm-NextButton").removeClass("disabledButton").html("next"); cmSurvey.hideNextButton(false); } };
- Click on the 'SAVE' button
- Make sure to test
Alternate Method
- Add the question(s) needed on the page
- Within a question on that page, access the html editor in the 'Instructions' area
- Click on the </> icon to access the source code
- Paste in the following code and update the time interval as needed
<script type="text/javascript"> cmSurvey.onPageLoad(function() { var seconds = 15; /* UPDATE THE TIME INTERVAL HERE (SECONDS) */ var delay = seconds * 1000, $submitButton = cmJq("#cm-NextButton"); $submitButton.hide(); setTimeout(function() { $submitButton.show(); }, delay); }); </script>
- Click on the </> icon to close this view
- Click 'SAVE'
- Make sure to test