Hi!
Our company has several brands. We are using JS (+custom CSS) in order to show the survey in different color depending on which brand the client uses.
However, what I've noticed is that the code get applied only to the first page of the survey and when you move further, the color returns to the default.
Sometimes we might have 20-30 questions (each on a separate page). So pasting this code 20-30 times looks like a poor solution.
Is there any way to apply the code to the entire survey rather than only 1 page?
Place the JavaScript in the survey header inside a
tag.Thanks a lot, TomG !
It works!
I'll leave these instructions in case someone else runs into the same issue.
In order to add it to the header:
- Go to the Look&Feel
- Select "General" and there click on "Edit" under the field saying "Header"
- Click on the icon "<>" in the first row. And here you can add the tag with your JS inside.
Hi TomG ,
I have similar requirements but instead of a single survey, we have nearly 20 different surveys.
So is there a way to apply custom JS code to all the surveys and questions inside them in a single place?
I think with the above approach suggested by Anna_Kebets I need to copy past the code at least at 20 different surveys.
https://community.qualtrics.com/XMcommunity/discussion/comment/42868#Comment_42868You could create a Look & Feel library message that includes the script then use that message as your header or footer in the 20 surveys.
You could also look at creating a new theme and placing it there.
Hi TomG ahmedA
I have added something like below in my header not in javascript block of the question
But I started getting "this" as null in the header. I know there is a way to create a custom function and then call it inside your JS of your question like ref: customFunc(this) but if I do like that then I will be repeating myself again for N number of times in all those questions.
Do you think is there a way to access question ID and perform some actions inside the header.
https://community.qualtrics.com/XMcommunity/discussion/comment/42981#Comment_42981It really depends on if you really need access to the question object 'this'. You can find questions on the page using:
jQuery(".QuestionOuter");
Then just traverse and manipulate the DOM from there. You really only need the question object if you need to use specific Qualtrics JavaScript API functions. You don't actually need the question object do the same thing as many of the API functions. You can do the same thing in the DOM.
Hi TomG
I am trying to show and hide a text box based on the selection of checkbox. Like below
Qualtrics.SurveyEngine.addOnReady(function () {
var QID = this.questionId;
jQuery("#" + QID + " .InputText ").hide();
jQuery("#" + QID + " inpututype='checkbox']").each(function () {
if (jQuery(this).prop("checked") == true) {
var v1 = jQuery(this).attr("id");
jQuery("id*='" + v1 + "~TEXT']").show();
} else {
var v1 = jQuery(this).attr("id");
jQuery("
}
});
jQuery("#" + QID + " .Selection ").on("click", function () {
jQuery("#" + QID + " inputtype='checkbox']").each(function () {
if (jQuery(this).prop("checked") == true) {
var v1 = jQuery(this).attr("id");
jQuery("(id*='" + v1 + "~TEXT']").show();
} else {
var v1 = jQuery(this).attr("id");
jQuery("vid*='" + v1 + "~TEXT']").val("");
jQuery("iid*='" + v1 + "~TEXT']").hide();
}
});
});
});
because of the above code, I wanted to access "this" inside the script placed in the header of the survey.
If I were doing it, I wouldn't use QID in the selectors at all. Assuming you want it to apply to the first question on the page:
var q = jQuery(".QuestionOuter").first(); //get the first question
q.find(".InputText").hide(); //find within the question
etc.
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.