I haven't played with any coding in years and I am struggling with understanding the template that Qualtrics provided for disabling the "Next Button" in a survey. The "Next Button" doesn't have to be disabled entirely (could be colored white). Since the survey is for research purposes, I need to keep the button from distracting participants on timed questions.

These are the two pages that I have looked at for coding.

.html

.pdf

If you have a better way to code this, or could explain the coding outline in greater depth for me, I'd appreciate the help.

I haven't played with any coding in years and I am struggling with understanding the template that Qualtrics provided for disabling the "Next Button" in a survey. The "Next Button" doesn't have to be disabled entirely (could be colored white). Since the survey is for research purposes, I need to keep the button from distracting participants on timed questions.

These are the two pages that I have looked at for coding.

https://s.qualtrics./WRAPI/QuestionAPI/classes/Qualtrics%20JavaScript%20Question%20API.html

https://www.qualtrics./wp-content/uploads/2011/07/Qualtrics-Question-API.pdf

If you have a better way to code this, or could explain the coding outline in greater depth for me, I'd appreciate the help.

• javascript
• survey
• qualtrics

3 Answers 3

A couple of things:

1. Due to a recent change in Qualtrics, Anthony's solution doesn't always work in JFE. Sometimes the JS runs before the buttons are present. The solution is defer hiding the buttons:

   Qualtrics.SurveyEngine.addOnload(function() {
       function hideEl(element) {
           if($(element)) $(element).hide();
       }   
       hideEl.defer('NextButton');
   });

2. To eliminate the brief button flash while waiting for JS to do its thing, you can add a style tag at the end of the question text instead:

   <style>
        #NextButton {display:none;}
   </style>

This can be done by including the following line of JavaScript in the questions JS editor:

$('NextButton').hide();

There is a way around the "flashing" issue:

You can simply time the response to your question, and in you timing option, just specify the "next" button not to appear before XX seconds (e.g., since my questions do not take more than a few seconds, I have set the "Enable submit after (seconds)" to 60 seconds.

You still need to specify in the JS that clicking an option or clicking a particular letter will move you to the next question. Like for example:

Qualtrics.SurveyEngine.addOnload(function()
{
var that = this;
this.questionclick = function(event,element){
if (element.type == 'radio') {
that.clickNextButton();
}
}
});

Importantly, make sure that in the "Look & Feel" options, you don't have anything in the "Number of questions per page" (as the timing is considered as a question) and that you insert page breaks between each "question&timing".

I hope this helps.