Hi there,
I'm hoping someone with more experience and a better understanding of how Qualtrics works under the hood can help me. I'm a researcher trying to implement one of our paper questionnaires in Qualtrics. One section is for calculating the number of hours of speech in different languages spoken to a child throughout their life. On the questionnaire, we basically have a grid that represents a different situation in the child's life (say, "at home with both parents") and then we mark the hours per weekday and weekend day in each of up to 4 languages, like so:
In Qualtrics, I'm setting a maximum of 10 situations, and what I'm hoping to achieve is for Situation 1 to be always shown, and then have a question asking "Add another situation?" and if yes, then Situation 2 is revealed on the same page as Situation 1, so that Situation 1 could be edited if needed. I would also like the page, when loaded the second time, to scroll down to the Situation 2 question, instead of remaining at the top of the page.
I have gotten some of this to work in what I think is a very hacky, roundabout way, and I'm hoping someone can let me know if there's a better way. What I have done is place all 10 Situation questions on the same page, and use display logic to hide them until a yes/no question for adding the next situation is answered. Then in the survey flow, I am repeating the block 10 times, so that Situation 1 shows up again with the entered responses, and remains editable. So, the survey goes to the first situation, which appears on the page and all the other situations are hidden. Then, when "next" is pressed, it goes to a new block with an "Add another situation?" question. When "yes" is selected, it repeats the situations block, but now Situation 2 is shown because of the display logic. And so on. Here is the survey flow (only up to Situation 4 to save space):
However, when the page loads with more than 1 situation, it doesn't scroll to the newest situation, but just stays at the top of the page. Is it possible to have the page scroll using some kind of anchor? I'm able to add an anchor div to the question, but it's not clear to me how to make the page scroll to only the newest visible question in JavaScript, since they are all on the same page. I'm assuming having 10 questions with code saying "jump to my anchor!" is not a great solution.
The other issue I'm running into is trying to use entered values on this page to pre-populate default values for other questions on the same page. Specifically, each situation has a start and end age, and I want the end age for Situation 1 to become the start age for Situation 2, and the end age for Situation 2 to become the start age for Situation 3, etc. I tried using piped text from the response, thinking it would work because after each situation the survey leaves the page to go to a new block, but it doesn't work. Then I tried setting an embedded data variable using Javascript on the block that asks if there's another situation and making the embedded variable the default value, but that isn't working either. I imagine my problem has something to do with how I've set this all up.
Does anyone have any advice about how to set this up in a better way, or if it seems okay as is, how I can accomplish jumping to the lowest visible question on the page and how to get the previous end age to be the new start age?
Thank you so much for any help you might have! It is much appreciated.
With your current approach and JavaScript you can:
- Use
scrollIntoView()
to scroll to to the first 'new' situation question - Copy the previous 'end age' to the new 'start age'.
Thank you, TomG. Here's what I have tried so far, unsuccessfully:
For copying the age values:
I've tried the simple route of just piping the response from Situation 1, but it remains blank in the survey. I'm assuming this is because both questions are technically on the same page, even though there is a block break between when they appear to the survey-taker.
So I tried using embedded data. The embedded variable seems to set correctly, but again, when the question appears, the text field remains blank. Here's my JavaScript, which appears on the question located in the other block, asking whether to add another situation or not:
Qualtrics.SurveyEngine.addOnReady(function()
{
var start_age = parseInt("${q://QID114/ChoiceTextEntryValue/2}");
Qualtrics.SurveyEngine.setEmbeddedData("age_sit_start", start_age);
});
The embedded variable is declared early on in the survey flow:
But it's still blank on the survey page when I set the default value to the embedded variable.
For auto-scrolling to the lowest question on the page:
On the grid question for Situation 2, I have this JavaScript:
Qualtrics.SurveyEngine.addOnload(function() {
var qid = this.questionId;
document.getElementById('QR~'+qid).scrollIntoView();
});
I have also tried this in the addOnReady section, without success. Can anyone see what I'm doing wrong for either of these?
For the age value, don't use embedded data. You can use JS to find and get the value of the previous situation since it is on the same page.
For scrolling, you have multiple questions on the page (I'm assuming all but first has display logic based on it's associated Yes/No question). So the method you tried would conflict. It looks like you have two questions per situation, so you need to scroll to the second to last question on the page:
Qualtrics.SurveyEngine.addOnReady(function() {
jQuery(".QuestionOuter").last().prevAll(".QuestionOuter").first().get(0).scrollIntoView();
});
Ideally, the above would only be attached to one question on the page (e.g., the 1st situation since it is always displayed).
EDIT: Updated because I forgot about Separators.
Thanks again TomG , I just figured out how to successfully copy the ages with Javascript instead of using default values, so that's working, and now I've just tried your code for the scrolling and that works too.
Thank you so much, I am incredibly grateful for your help here!
I've changed my survey to auto-advance in the Look and Feel section for better user experience in the first part of the questionnaire, but that seems to be interfering with the JavaScript code for scrolling to the newest question on the page. @TomG, do you have any ideas about how to override the auto-advance feature just on this one page of questions? Thank you very much!
https://community.qualtrics.com/XMcommunity/discussion/comment/50861#Comment_50861I don't know how to turn it off for a specific page, or if it is even possible to hack it some way.
If you are are interested, I have a autoAdvancePages function that can be turned on and off that might work for you.
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.