Open your Look and Feel Menu
Selecting the "Advanced" tab
Click on the green "Add Custom CSS" button
Paste the following in to the box that appears:
#PreviousButton, #NextButton{
display: none;
}
If you would like to hide them on a specific page of your survey:
Add the following to the JavaScript editor for the first question on the page you would like to have them hidden for:
Qualtrics.SurveyEngine.addOnReady(function () {
$('NextButton').hide();
$('PreviousButton').hide();
});
Eventually I managed to do it with:
Qualtrics.SurveyEngine.addOnload(function ()
{
//disables the next button on the page
this.hidePreviousButton();
});
Qualtrics.SurveyEngine.addOnload(function ()
{
//disables the next button on the page
this.hidePreviousButton();
});
and
Qualtrics.SurveyEngine.addOnReady(function () {
$('NextButton').hide();
$('PreviousButton').hide();
});
I thought maybe other CSS is overriding, but the only other custom code is in the Look and Feel -> Style -> Custom CSS and seems to have nothing to do with the buttons (just the background color of the answer container:
.Skin label.SingleAnswer{background-color:#C0C0C0;}
Another way of doing this is:
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
jQuery("#PreviousButton").css("visibility","hidden");
});
visibility:hidden;also hides an element.
However, the element will still take up the same space as before. The element will be hidden, but still affect the layout. Taken from here: https://www.w3schools.com/css/css_display_visibility.asp
https://www.qualtrics.com/community/discussion/comment/689#Comment_689I'm trying to hide them on just one page - I've copied the Java Script in but it won't work on the preview - is there something else I need to do ?
ssouth I changed the "Previous" to "Next" and the code below worked for the "next button". The original version of yinbar is for hiding the "previous button".
Qualtrics.SurveyEngine.addOnload(function ()
{
//disables the next button on the page
this.hideNextButton();
});
Why can’t you go to the look and feel and just de select the buttons or remove the text. Can do this by block as well. or create a button and just make it the same color as your background with no text.
I am running into an odd issue. I am using JavaScript to hide the Next button until someone interacts with the question and the validation check is met. This is being used on constant sum questions. The script works fine (see script below), however, if there are two or more constant sum questions in sequence, although with a page break between each question, the script won’t automatically disable the Next button for all subsequent questions. Interestingly, the button will become disabled when someone interacts with the subsequent questions but the issue is that if someone does not interact with the question at all and chooses to hit the Next button, they will be able to skip that question.
I was trying to figure out what the issues was, and to make things weirder (and clearer at the same time), the issue persists only if the questions with the JavaScript I described are in consecutive pages. If I add a a question in between the two constant sum questions and each question has its own page, then the script does its job and works fine. Essentially, the issue only rises when the constant sum questions are in consecutive pages. I’ve added hidden questions in between but that does not fix the issue.
I cannot add the validation check ‘Must total to 100’ because I am using that feature for another validation check I need.
Any suggestions?
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
this.hideNextButton();
});
Qualtrics.SurveyEngine.addOnReady(function () {
let quest = this,
qc = quest.questionContainer,
id = quest.questionId,
total_box = qc.querySelector("#" + id + "_Total");
total_box.oninput = function () {
quest.disableNextButton();
if (total_box.value == 100) quest.enableNextButton();
if (total_box.value == 100) quest. showNextButton();
};
});
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.