Extract slider question value and manipulate using Javascript | XM Community

Extract slider question value and manipulate using Javascript


Hi,

I'm building an experiment in which participants have to move sliders.
I've defined an embedded field that will contain the manipulated slider result (after using java script).
However, it seems that the javascript cannot capture the slider value (into "s1scr" variable) and thus no value is passed to "score" variable (the If statement is not executed correctly). The result is that the piped text shown in the next page is showing the "score" initial value.

Enclosed the javascript code that I've place within addOnload

**
Qualtrics.SurveyEngine.addOnload(function()
{

var s1scr = parseInt("${q://QID3/ChoiceNumericEntryValue/1}");

var score = 0;
if (s1scr == 50)
{
score = 30;
}

Qualtrics.SurveyEngine.setEmbeddedData("score", score);

/*Place your JavaScript here to run when the page loads*/

});**

In addition, enclosed the survey flow and the actual survey!
!
.

Thanks in advance for all your assistance

15 replies

Userlevel 4
Badge +4
The problem lies in the fact that you're trying to calculate your score variable when the slider question page is displayed (you're adding stuff in the addOnLoad function).

I suggest the following implementation: after the slider question create a page for calculating the score variable like this:
!

And add the following JavaScript to the Calculating Score Q:

var s1scr = parseInt("${q://QID3/ChoiceNumericEntryValue/1}");
var score = 0;
if (s1scr >= 50) {
score = 30;
}

Qualtrics.SurveyEngine.setEmbeddedData("score", score);
this.clickNextButton()

Note: I changed the if to >= as it is easier to test and used clickNextButton() as opposed to a timer with Auto-Advance time - in my experience, a timer with Auto-Advance set to a minimal time throws the JS off so this is a solid way to ensure JS execution.

Hope that helps!
@npetrov937 thanks for your prompt reply, it was very helpful.
Another question that popped up concerning the current experiment.
I want to repeat the same block 10 times. After each time I want to show the result of the current round. At the end (after 10 rounds) I want to show the aggregated score of all rounds.
Hi all,

Does someone has a solution for my last question?
1. How to define the number of times a block can be repeated?
2. Each time a block is presented (in my case a single round) a variable stores the results (i.e. score) How can I create an aggregated variable that sum up the results of all rounds?
3. The score is extracted from the slider value.

Thanks in advance
Userlevel 4
Badge +4
> @Eski said:
> Hi all,
>
> Does someone has a solution for my last question?
> 1. How to define the number of times a block can be repeated?
> 2. Each time a block is presented (in my case a single round) a variable stores the results (i.e. score) How can I create an aggregated variable that sum up the results of all rounds?
> 3. The score is extracted from the slider value.
>
> Thanks in advance
>

Hi @Eski ,

I would suggest taking the same process described above and replicating it as many times as you need. In your case, create 10 slider questions. Then in the javascript code pull all of the values from the sliders and save them to different score variables (if you need to save them); then aggregate them - it would look something like this:

var slider1 = parseInt("${q://QID3/ChoiceNumericEntryValue/1}"); //replace with your own sliders //id's
var slider2 = parseInt("${q://QID3/ChoiceNumericEntryValue/1}");
var slider3 = parseInt("${q://QID3/ChoiceNumericEntryValue/1}");

var score1 = 0;
var score2 = 0;
var score3 = 0;
var avgScore =0;


if (slider1 >= 50) {
score1 = 30;
}
if (slider2 >= 50) {
score2 = 30;
}
if (slider3 >= 50) {
score3 = 30;
}

avgScore = (score1+score2+score3)/3 //calculating the mean score

//setting the already-created embedded data variables score1, score2, score3, avgScore
Qualtrics.SurveyEngine.setEmbeddedData("score1", score1);
Qualtrics.SurveyEngine.setEmbeddedData("score2", score2);
Qualtrics.SurveyEngine.setEmbeddedData("score3", score3);
Qualtrics.SurveyEngine.setEmbeddedData("avgScore", avgScore);

this.clickNextButton()

Copy-paste as much as you want. Obviously, the code can be written in a much better way but at least this way it is quite clear.

Hope that helps.
Thanks for your reply!
I've built my experiment based on your guidelines, however after calculating the aggregated variable (within the JavaScript) I'm not able to set the value back to the embedded field I've created within the Survey Flow and it keeps giving me the initial value of 0. What can be the reason?
Attached the code and screens from my experiment:

!
!

Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/

});

Qualtrics.SurveyEngine.addOnReady(function()
{
var sld1tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/1}");
var sld2tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/2}");
var sld3tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/3}");
var sld4tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/4}");
var sld5tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/5}");
var sld6tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/6}");
var sld7tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/7}");
var sld8tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/8}");
var sld9tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/9}");
var sld10tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/10}");
var sld11tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/11}");
var sld12tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/12}");
var sld13tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/13}");
var sld14tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/14}");
var sld15tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/15}");
var sld16tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/16}");
var sld17tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/17}");
var sld18tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/18}");
var sld19tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/19}");
var sld20tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/20}");
var sld21tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/21}");
var sld22tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/22}");
var sld23tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/23}");
var sld24tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/24}");
var sld25tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/25}");
var sld26tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/26}");
var sld27tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/27}");
var sld28tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/28}");
var sld29tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/29}");
var sld30tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/30}");
var sld31tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/31}");
var sld32tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/32}");
var sld33tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/33}");
var sld34tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/34}");
var sld35tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/35}");
var sld36tr1 = parseInt("${q://TR1MIS/ChoiceNumericEntryValue/36}");

var sld1tr1scr = 0;
var sld2tr1scr = 0;
var sld3tr1scr = 0;
var sld4tr1scr = 0;
var sld5tr1scr = 0;
var sld6tr1scr = 0;
var sld7tr1scr = 0;
var sld8tr1scr = 0;
var sld9tr1scr = 0;
var sld10tr1scr = 0;
var sld11tr1scr = 0;
var sld12tr1scr = 0;
var sld13tr1scr = 0;
var sld14tr1scr = 0;
var sld15tr1scr = 0;
var sld16tr1scr = 0;
var sld17tr1scr = 0;
var sld18tr1scr = 0;
var sld19tr1scr = 0;
var sld20tr1scr = 0;
var sld21tr1scr = 0;
var sld22tr1scr = 0;
var sld23tr1scr = 0;
var sld24tr1scr = 0;
var sld25tr1scr = 0;
var sld26tr1scr = 0;
var sld27tr1scr = 0;
var sld28tr1scr = 0;
var sld29tr1scr = 0;
var sld30tr1scr = 0;
var sld31tr1scr = 0;
var sld32tr1scr = 0;
var sld33tr1scr = 0;
var sld34tr1scr = 0;
var sld35tr1scr = 0;
var sld36tr1scr = 0;
var trn1Score = 0;

if(sld1tr1 == 50) {
sld1tr1scr = 30;
}

if(sld2tr1 == 50) {
sld2tr1scr = 30;
}

if(sld3tr1 == 50) {
sld3tr1scr = 30;
}

if(sld4tr1 == 50) {
sld4tr1scr = 30;
}

if(sld5tr1 == 50) {
sld5tr1scr = 30;
}

if(sld6tr1 == 50) {
sld6tr1scr = 30;
}

if(sld7tr1 == 50) {
sld7tr1scr = 30;
}

if(sld8tr1 == 50) {
sld8tr1scr = 30;
}

if(sld9tr1 == 50) {
sld9tr1scr = 30;
}

if(sld10tr1 == 50) {
sld10tr1scr = 30;
}

if(sld11tr1 == 50) {
sld11tr1scr = 30;
}

if(sld12tr1 == 50) {
sld12tr1scr = 30;
}

if(sld13tr1 == 50) {
sld13tr1scr = 30;
}

if(sld14tr1 == 50) {
sld14tr1scr = 30;
}

if(sld15tr1 == 50) {
sld15tr1scr = 30;
}

if(sld16tr1 == 50) {
sld16tr1scr = 30;
}

if(sld17tr1 == 50) {
sld17tr1scr = 30;
}

if(sld18tr1 == 50) {
sld18tr1scr = 30;
}

if(sld19tr1 == 50) {
sld19tr1scr = 30;
}

if(sld20tr1 == 50) {
sld20tr1scr = 30;
}

if(sld21tr1 == 50) {
sld21tr1scr = 30;
}

if(sld22tr1 == 50) {
sld22tr1scr = 30;
}

if(sld23tr1 == 50) {
sld23tr1scr = 30;
}

if(sld24tr1 == 50) {
sld24tr1scr = 30;
}

if(sld25tr1 == 50) {
sld25tr1scr = 30;
}

if(sld26tr1 == 50) {
sld26tr1scr = 30;
}

if(sld27tr1 == 50) {
sld27tr1scr = 30;
}

if(sld28tr1 == 50) {
sld28tr1scr = 30;
}

if(sld29tr1 == 50) {
sld29tr1scr = 30;
}

if(sld30tr1 == 50) {
sld30tr1scr = 30;
}

if(sld31tr1 == 50) {
sld31tr1scr = 30;
}

if(sld32tr1 == 50) {
sld32tr1scr = 30;
}

if(sld33tr1 == 50) {
sld33tr1scr = 30;
}

if(sld34tr1 == 50) {
sld34tr1scr = 30;
}

if(sld35tr1 == 50) {
sld35tr1scr = 30;
}

if(sld36tr1 == 50) {
sld36tr1scr = 30;
}

trn1Score = (sld1tr1scr + sld2tr1scr + sld3tr1scr + sld4tr1scr + sld5tr1scr + sld6tr1scr + sld7tr1scr + sld8tr1scr + sld9tr1scr + sld10tr1scr + sld11tr1scr + sld12tr1scr + sld13tr1scr + sld14tr1scr + sld15tr1scr + sld16tr1scr + sld17tr1scr + sld18tr1scr + sld19tr1scr + sld20tr1scr + sld21tr1scr + sld22tr1scr + sld23tr1scr + sld24tr1scr + sld25tr1scr + sld26tr1scr + sld27tr1scr + sld28tr1scr + sld29tr1scr + sld30tr1scr + sld31tr1scr + sld32tr1scr + sld33tr1scr + sld34tr1scr + sld35tr1scr + sld36tr1scr) ;

Qualtrics.SurveyEngine.setEmbeddedData("trn1Score", trn1Score);

this.clickNextButton();


/*Place your JavaScript here to run when the page is fully displayed*/

});

Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/

});
Userlevel 7
Badge +27
TR1MIS isn't a valid question id. I suspect that is the question label. A question id is in the form QIDx, where x is number.
Thanks @TomG I've figured it out before you've answered.
Btw, there's a more elegant way to right the code?
Userlevel 7
Badge +27
> @Eski said:
> Thanks @TomG I've figured it out before you've answered.
> Btw, there's a more elegant way to right the code?

Definitely. How about:
```
var trn1Vals = [
parseInt("${q://QIDx/ChoiceNumericEntryValue/1}"),
parseInt("${q://QIDx/ChoiceNumericEntryValue/2}"),
...
parseInt("${q://QIDx/ChoiceNumericEntryValue/36}")
];
var trn1Score = 0;
jQuery.each(trn1Vals, function(i, val) { if(val == 50) trn1Score = trn1Score + 30; });
Qualtrics.SurveyEngine.setEmbeddedData("trn1Score", trn1Score);
this.clickNextButton();
```
Thanks @TomG but unfortunately, when I'm trying to put this code it doesn't advance to the next page, and when manually clicking on next page it doesn't show the calculated value at all.
Userlevel 7
Badge +27
You replaced the ... with the rest of the piped values and QIDx with the actual QID number, correct? Check the console for errors.

https://www.qualtrics.com/community/discussion/comment/20800#Comment_20800I need a simpler solution: simply remember the choice of the slider and display it on the next page.
I am not sure what I am doing wrong but following the steps described by npetrov937 makes my survey show the page "Calculating score" (no amount of Display logic hides it) and, more important, does not display the chosen value of the slider.

Userlevel 4
Badge +4

https://www.qualtrics.com/community/discussion/comment/30644#Comment_30644Hi mihaidricu ,

then yo wouldn't use javascript for that - just use piped text on the next page. More info about piped text here - https://www.qualtrics.com/support/survey-platform/survey-module/editing-questions/piped-text/piped-text-overview/

https://www.qualtrics.com/community/discussion/comment/30645#Comment_30645Thanks! I figured it out after some fiddling. The strange thing is that the option only appear in the piped text as a blank space. I circled it for you here. Is it supposed to be like that or is it a bug? It looks like an empty space but when I move the cursor over it it selects it. It was literally trial and error till i found it.
2020-09-28 16_30_12-Edit Survey _ Qualtrics Survey Software.png

Badge +3

Does
${q://QI#/ChoiceNumericEntryValue/1}
give the value of the selection on a slider on the most recent version of qualtrics? I can't even console.log this.
And yes, I have the proper ID, quotes, and it is executed on "unLoad."

Userlevel 7
Badge +27

https://community.qualtrics.com/XMcommunity/discussion/comment/55537#Comment_55537You can’t pipe on the same page as the question.

Leave a Reply