@BettoLamacchia - I have tweaked your code slightly to work with multiple star slider, please have a look:-
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
jQuery('.ResultsInput').hide();
jQuery('.ResultsInput').after("<span id='autoinsert'></span>");
jQuery('.ResultsInput').on("change input",function()
{
console.log('aa');
var widthvalue = parseInt(jQuery(this).val());
if (widthvalue==1)
{
jQuery(this).next().html("Molto insoddisfatto");
}
if (widthvalue==2)
{
jQuery(this).next().html("Insoddisfatto");
}
if (widthvalue==3)
{
jQuery(this).next().html("Molto 3");
}
if (widthvalue==4)
{
jQuery(this).next().html("Molto 4");
}
if (widthvalue==5)
{
jQuery(this).next().html("Molto 5");
}
});
});
Hi
@KimothiSaurabh, many thanks, it works!
As I want to have this question mobile friendly, have you got a code have values show above each star slider instead of the right side?
Thanks again
@BettoLamacchia - That setup is mobile friendly by default bu if you still want values to be shown above starts, you can use this code:-
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
jQuery('.ResultsInput').hide();
jQuery('tbody .BarOuter').prepend("<div class='autoinsert'></div>")
jQuery('.ResultsInput').on("change input",function()
{
var widthvalue = parseInt(jQuery(this).val());
if (widthvalue==1)
{
jQuery(this).parent().parent().find('.autoinsert').html("Molto insoddisfatto");
}
if (widthvalue==2)
{
jQuery(this).parent().parent().find('.autoinsert').html("Insoddisfatto");
}
if (widthvalue==3)
{
jQuery(this).parent().parent().find('.autoinsert').html("Molto 3");
}
if (widthvalue==4)
{
jQuery(this).parent().parent().find('.autoinsert').html("Molto 4");
}
if (widthvalue==5)
{
jQuery(this).parent().parent().find('.autoinsert').html("Molto 5");
}
});
});
>
@KimothiSaurabh said:
>
@BettoLamacchia - That setup is mobile friendly by default bu if you still want values to be shown above starts, you can use this code:-
>
> Qualtrics.SurveyEngine.addOnReady(function()
> {
> /*Place your JavaScript here to run when the page is fully displayed*/
> jQuery('.ResultsInput').hide();
> jQuery('tbody .BarOuter').prepend("<div class='autoinsert'></div>")
> jQuery('.ResultsInput').on("change input",function()
> {
> var widthvalue = parseInt(jQuery(this).val());
> if (widthvalue==1)
> {
> jQuery(this).parent().parent().find('.autoinsert').html("Molto insoddisfatto");
> }
> if (widthvalue==2)
> {
> jQuery(this).parent().parent().find('.autoinsert').html("Insoddisfatto");
> }
> if (widthvalue==3)
> {
> jQuery(this).parent().parent().find('.autoinsert').html("Molto 3");
> }
> if (widthvalue==4)
> {
> jQuery(this).parent().parent().find('.autoinsert').html("Molto 4");
> }
> if (widthvalue==5)
> {
> jQuery(this).parent().parent().find('.autoinsert').html("Molto 5");
> }
> });
>
> });
Many thanks, that's great
Hi! Do you know how to have the custom values localized if there's translations in the survey?
You can create a span and fetch text from there. Put this span in you questions text So it would be like:-
<span class='rate5' style="display:none;">Molto 5</span>
jQuery(this).parent().parent().find('.autoinsert').html(jQuery('.rate5').html());
