Hello! I´m trying to use display logic for embedded data, however it is not working and I can´t understand why. I have some questions like this one below (see image) that I only want them to appear if “__js__age” is equal ou above 18. However the question it is not appearing for anyone.
As an alternative instead of using display logic funtionality I also tried to use javascript code for display logic and put the following code (but is still not working):
Qualtrics.SurveyEngine.addOnReady(function() { var age1 = Qualtrics.SurveyEngine.getJSEmbeddedData("__js_age");
if (age1 !== null && age1 >= 18) { jQuery(this.questionId).show(); // Show the current question } else { jQuery(this.questionId).hide(); // Hide the current question } });
I also put some alerts for debuging purposes and when I run the survey a alert pops up saying “hiding question” or “showing question” (as it should) but in reality the question still appears. And yes, the embedded date is calculating right because I also put some alerts to check it.
So I think the problem is on display logic.
Page 1 / 1
Hi @aribeiro, I’ve just tested it using the normal ‘display logic’ and it perfectly works for me.
In case you are going the JavaScript route, you could use
this.clickNextButton();
instead of trying to hide the question.
Hi @aribeiro ,
Can you make sure that if there is any logic that you have in survey flow to populate the embedded data, it is above the question block?
@Sowrabh1993 Hi! Yes it is above the question block. And I also tried to set as a number set but the same keeps happen.
@ManfredBM
Yes, it should work on my survey it is just strange why it is not.
I´m going to try that! Thank you
Hi @aribeiro
I think you might have missed the “#” selector in the JQuery code.
Qualtrics.SurveyEngine.addOnReady(function () { let age1 = Qualtrics.SurveyEngine.getJSEmbeddedData("__js_age"); let that = this; if (age1 !== null && age1 >= 18) { jQuery("#" + that.questionId).show(); // Show the current question } else { jQuery("#" + that.questionId).hide(); // Hide the current question } });
Also want to confirm are you using the Simple Layout, if so with simple layout it seem JQuery is not supported.
so your updated code should look something like this:
Qualtrics.SurveyEngine.addOnReady(function() { let age1 = Qualtrics.SurveyEngine.getJSEmbeddedData("__js_age"); let that = this if (age1 !== null && age1 >= 18) { document.getElementById(that.questionId).style.display = "block" ; // Shows the current question } else { document.getElementById(that.questionId).style.display = "none" ; // Hide the current question } });
Hi @NiC thank you so much for the updated code. And yes, I´m using Simple Layout. I just change the code for the one you gave me, however the question it is still appearing independently of age.
So, now I added some alerts to see if it is storing the age in a correct way and if it is receiving the “hide or show” correctly.
Qualtrics.SurveyEngine.addOnReady(function() {
let age1 = Qualtrics.SurveyEngine.getJSEmbeddedData("__js_age");
let that = this;
alert("Age: " + age1); // Display current age in an alert
if (age1 !== null && age1 >= 18) {
alert("Display Logic Check: Showing Question"); // Display a message that the question should be shown
document.getElementById("QID14").style.display = "block"; // Shows the question with ID QID14
} else {
alert("Display Logic Check: Hiding Question"); // Display a message that the question should be hidden
document.getElementById("QID14").style.display = "none"; // Hide the question with ID QID14
}
});
I put this alerts. And when I run the preview of the screen this appears (picture below). It calculates the age as 19 (which is correct for the DOB I inserted) and it appears the alert of showing question (as it should). On another example the age 13, the alert says “hiding” (last image), however the question appears...
@aribeiro
just the mistake in my code the new layout has a new way in which tags are identified please find below the updated code
Qualtrics.SurveyEngine.addOnReady(function () { let age1 = Qualtrics.SurveyEngine.getJSEmbeddedData("__js_age"); let that = this; if (age1 !== null && age1 >= 18) { document.getElementById("question-" + that.questionId).style.display = "block"; // Shows the current question } else { document.getElementById("question-" + that.questionId).style.display = "none"; // Hide the current question } });
@NiC Thank you so much! It is working now and I tested multiple times! :)