Best answer by Anonymous
View original
How to customize snapping slider labels
I am implementing a slider question with example ranges from (40000000 to 65000000). I would like it to snap to grid at 21 values (20 intervals). However, the labels are currently overlapping and I would like to format them with dollar sign and commas ($40,000,000 to $65,000,000). My thought was to: show the grid lines for all values but only display alternative numbers so that the overlapping problem is solved. Would anyone know how to do that as well as to implement the formatting code? Any other suggestions will also be greatly appreciated. Thanks!
A
Hello @sandys ,
Paste the below code in the js(OnReady) slider question
`jQuery("#"+this.questionId+" .numbers li:odd").hide();`
The above code will hide alternative labels
OR
Paste the below code and change the value of 'n' to show labels after specific number of labels but first and last labels will always be visible
var n=3;
var s=jQuery("#"+this.questionId+" .numbers li").hide().length
jQuery("#"+this.questionId+" .numbers li.first , li.last").show();
for(var i=1;i<s;i++){
if(i%n==0){jQuery("#"+this.questionId+" .numbers li:eq("+i+")").show();}
}
Paste the below code in the js(OnReady) slider question
`jQuery("#"+this.questionId+" .numbers li:odd").hide();`
The above code will hide alternative labels
OR
Paste the below code and change the value of 'n' to show labels after specific number of labels but first and last labels will always be visible
var n=3;
var s=jQuery("#"+this.questionId+" .numbers li").hide().length
jQuery("#"+this.questionId+" .numbers li.first , li.last").show();
for(var i=1;i<s;i++){
if(i%n==0){jQuery("#"+this.questionId+" .numbers li:eq("+i+")").show();}
}
Hi @Shashi, thank you for your suggestion. However, it does not work for my survey:
https://berkeley.qualtrics.com/jfe/form/SV_e2thgs3qW20P7RH
As you can see, all the numbers are still there. If you would like to help troubleshoot more, I've posted a .qsf of the survey. Thanks in advance!
https://berkeley.qualtrics.com/jfe/form/SV_e2thgs3qW20P7RH
As you can see, all the numbers are still there. If you would like to help troubleshoot more, I've posted a .qsf of the survey. Thanks in advance!
A
> @sandys said:
> Hi @Shashi, thank you for your suggestion. However, it does not work for my survey:
> https://berkeley.qualtrics.com/jfe/form/SV_e2thgs3qW20P7RH
>
> As you can see, all the numbers are still there. If you would like to help troubleshoot more, I've posted a .qsf of the survey. Thanks in advance!
Thanks for clarification. You are using constant sum question, hence use the below code in constant sum slider type question
var n=2;
var s=jQuery("#"+this.questionId+" .xlabel .BorderColor").css("visibility","hidden").length - 2;
jQuery("#"+this.questionId+" .xlabel .MinValue , .G"+(s-1)).css("visibility","visible");
for(var i=1;i<s;i++){
if(i%n==0){jQuery("#"+this.questionId+" .xlabel .G"+i).css("visibility","visible");}
}
> Hi @Shashi, thank you for your suggestion. However, it does not work for my survey:
> https://berkeley.qualtrics.com/jfe/form/SV_e2thgs3qW20P7RH
>
> As you can see, all the numbers are still there. If you would like to help troubleshoot more, I've posted a .qsf of the survey. Thanks in advance!
Thanks for clarification. You are using constant sum question, hence use the below code in constant sum slider type question
var n=2;
var s=jQuery("#"+this.questionId+" .xlabel .BorderColor").css("visibility","hidden").length - 2;
jQuery("#"+this.questionId+" .xlabel .MinValue , .G"+(s-1)).css("visibility","visible");
for(var i=1;i<s;i++){
if(i%n==0){jQuery("#"+this.questionId+" .xlabel .G"+i).css("visibility","visible");}
}
Leave a Reply
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.