Delayed Slider Question Doesn't work with my Javascript | XM Community
Skip to main content

Hello! I'm new to customizing Qualtrics survey questions and need some support. I have slider questions that I'm using Javascript to delay until after a video finishes playing (I found the script in this post), but the slider doesn't work once it appears after the delay. The slider disappears and I'm not able to move the slider when previewing it (see image below). My other questions (e.g., multiple choice) work just fine though with the exact same script. Does anyone know how I can fix this?

Screen Shot 2021-01-17 at 8.08.56 PM.png

This seems to be a really weird issue. Perhaps Qualtrics should look into it. LaurenK could you please ask someone from the tech team to check why the slider gets disabled when it is hidden.
Meanwhile, you can use this code to get the job done.
Qualtrics.SurveyEngine.addOnReady(function () {
    qid = "#" + this.questionId;
    document.querySelector(qid).style.opacity = "1%";
    delay_time = 3000;
    setTimeout(function () {
        document.querySelector(qid).style.opacity = "";
    }, delay_time);
});


Hi ahmedA! Unfortunately, the Qualtrics Support team is unable to provide assistance with troubleshooting custom code solutions. Posting right here in the Developer Corner will be your best bet moving forward! 😀


Thanks for update Lauren, but I think this problem isn't associated with the custom code, but instead with how Qualtrics implements the slider.
There is some code at the backend, which freezes the slider once it is hidden. Perhaps someone from the tech team could share advice on how to avoid this issue or what is causing the freeze. Because it doesn't happen with other questions.


Thank you ahmedA! I decided to go a different route with the survey but I appreciate your response


https://community.qualtrics.com/XMcommunity/discussion/comment/33620#Comment_33620This code does not seem to work if I want to hide several questions in the same block, right?
ahmedA: Do you have any suggestion what I need to change so that the code works for multiple questions?


I've been struggling with the delayed slider for a little bit now! I think I've found a workaround for, what seems to be, a glitch. You can adjust the visibility in CSS through JavaScript, setting the question to hidden on load and delay setting it to visible on ready. Hopefully the code below will help someone!

Qualtrics.SurveyEngine.addOnload(function()
{
qid = "#" + this.questionId;
document.querySelector(qid).style.visibility = "hidden";
});
Qualtrics.SurveyEngine.addOnReady(function () {

delay_time = 5*1000;
setTimeout(function () {
document.querySelector(qid).style.visibility = "visible";
}, delay_time);
});

 


Leave a Reply