Hide next button not working at the begining of a randomizer | Experience Community
Skip to main content
Question

Hide next button not working at the begining of a randomizer

  • Apr 15, 2021 6:45 AM UTC
  • 6 replies
  • 52 views

Dear community, I'm designing a survey with 20 test entry questions in a randomizer. I would like to hide the next botton until participants type something in the text bar. I used the following code :

   function hideEl(element) {
       element.hide();
   }  
   var nb = $('NextButton');
   hideEl.defer(nb);
   $(this.questionId).down('.InputText').on('keyup', function(event) {
       if(this.value.length == 0) nb.hide();
       else nb.show();
   });
which works perfect for other questions in the randomizer except for the first one.
Can anyone help me with this problem?
I am very new to Qualtrics, so please explain the solution (if there is any) more explicitly. Thank you all.


6 replies

  • Author
  • Apr 15, 2021 9:25 AM UTC

My goal was to prevent participants from hearing audios multiple times.
I tried to disable the play button by hiding the audio player after one. However, if the validation (I forced them to answer all questions) fails, which means participants click the next button without inputting a word, the player appears again.
So another option would be to disable the play botton of audio player after one click regardless of the state of validation.
Can someone help me to fix one of the two problems above? Thank in advance.


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Apr 15, 2021 3:33 PM UTC

You can use the onended event listener for the audio/video file. Here's a demo.
These are the codes used in the demo:
Question HTML:

    

The Next button is hidden.
Press play and wait for the audio to end for it to appear.


    
        
        
        Your browser does not support the audio element.
    

Question JavaScript:
Qualtrics.SurveyEngine.addOnReady(function () {
    let quest = this,
        aud = this.questionContainer.querySelector("#myAudio"),
        audWrap = this.questionContainer.querySelector("#audioWrapper");

    quest.hideNextButton();

    aud.onended = function () {
        audWrap.innerHTML = "The Audio has ended. The Next Button is now visible.";
        quest.showNextButton();
    };
});


  • Author
  • Apr 16, 2021 1:12 AM UTC

https://www.qualtrics.com/community/discussion/comment/36598#Comment_36598Dear ahmedA, thank you so much for your reply.
Your code words prfectly on the first question within a randomizer. However, when I clicked the next button without inputting a word (validation failed), the player would appear again.


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Apr 16, 2021 8:16 AM UTC

Yes. That will happen. Validation reloads the page.


  • Author
  • Apr 16, 2021 8:49 AM UTC

https://www.qualtrics.com/community/discussion/comment/36625#Comment_36625That's why I chose to hide the next button until they type an answer.
Do you know why hiding the next button doesn't work in the first question of a block?


Forum|alt.badge.img+22
  • Level 7 ●●●●●●●
  • Apr 16, 2021 10:59 AM UTC

I can't say, because a lot of would depend upon your set up, the order and the JS in other questions.