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

Hide next button not working at the begining of a randomizer

  • April 15, 2021
  • 6 replies
  • 36 views
R

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

    R
    • RBear
    • Author
    • April 15, 2021

    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.

    A
    Level 7 ●●●●●●●
    Forum|alt.badge.img+22
    • ahmedA
    • Level 7 ●●●●●●●
    • April 15, 2021

    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();
        };
    });

      R
      • RBear
      • Author
      • April 16, 2021

      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.

      A
      Level 7 ●●●●●●●
      Forum|alt.badge.img+22
      • ahmedA
      • Level 7 ●●●●●●●
      • April 16, 2021

      Yes. That will happen. Validation reloads the page.

      R
      • RBear
      • Author
      • April 16, 2021

      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?

      A
      Level 7 ●●●●●●●
      Forum|alt.badge.img+22
      • ahmedA
      • Level 7 ●●●●●●●
      • April 16, 2021

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

      Terms & ConditionsAccessibility statement