Adjust the scale points location in a slider question | XM Community
Skip to main content
Question

Adjust the scale points location in a slider question


Hello!
Is it possible to reposition the scale points in a slider question? I'd want to move it below the actual slider, rather than above it. I tried the following code in the "Slider" question's js(OnReady) function, but it did not work.

jQuery("ul.labels").insertAfter("div.slider-container:last");

image.png

5 replies

Rudi
QPN Level 3 ●●●
Forum|alt.badge.img+16
  • QPN Level 3 ●●●
  • 162 replies
  • March 24, 2022

Hi Maria,

works pretty much the same way as our other setup

image.pngJS :
Qualtrics.SurveyEngine.addOnload(function()
{

let labelContainer = document.getElementsByClassName('labels-container')
console.log(this.questionId)
let tables = document.getElementsByTagName('table')
console.log(tables)

tables[0].insertAdjacentHTML('afterend', labelContainer[0].innerHTML);

labelContainer[0].remove()
});

Best regards

Rudi


Forum|alt.badge.img+1
  • 1 reply
  • March 26, 2022

https://community.qualtrics.com/XMcommunity/discussion/comment/44903#Comment_44903Hi Rudi,
I tried the JS but it doesn't work well. May I know why it looks like this? Thank you
Slider grid under.PNG!


Rudi
QPN Level 3 ●●●
Forum|alt.badge.img+16
  • QPN Level 3 ●●●
  • 162 replies
  • March 28, 2022

hi there,
could you share the preview link? or let me know which layout you are using?

Best Regards,
Rudi


Forum|alt.badge.img+1
  • 2 replies
  • July 25, 2022

https://community.qualtrics.com/XMcommunity/discussion/comment/44903#Comment_44903Hi Rudi, this code worked perfectly for me. But there is one issue.
Actually I have multiple sliders on my page and this code is working only for the first slider.
So, could you please provide the solution on how to implement this on multiple sliders.
Thanks in advance!


Rudi
QPN Level 3 ●●●
Forum|alt.badge.img+16
  • QPN Level 3 ●●●
  • 162 replies
  • July 25, 2022

Hi Maria,

here you go:

Qualtrics.SurveyEngine.addOnload(function()
{

let labelContainer = document.getElementsByClassName('labels-container')

console.log(labelContainer)


let tables = document.getElementsByTagName('table')
console.log(tables)


for(let i=tables.length-1;i>=0;i--){

tables[i].insertAdjacentHTML('afterend', labelContainer[i].innerHTML);
labelContainer[i].remove()

}


});
Best regards

Rudi


Leave a Reply