Change color of chosen answer....

More
3 years 9 months ago #97666 by jaytsang
jaytsang created the topic: Change color of chosen answer....
Hi,
I am newbie in using LimeSurvey. So I have question, is there a way to change the color of the selected answer(s)?

regards,

Please Log in to join the conversation.

More
3 years 9 months ago - 3 years 9 months ago #97676 by DenisChenu
DenisChenu replied the topic: Change color of chosen answer....
Hello,

You can use somethink like that for "radio" and "checkbox" button:
input.radio:checked + label,input.checkbox:checked + label{
color:red;
}
Work on real browser (not in IE6/7, to be tested in IE8).

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .
Last Edit: 3 years 9 months ago by DenisChenu.

Please Log in to join the conversation.

More
3 years 9 months ago #97681 by tpartner
tpartner replied the topic: Change color of chosen answer....
Here is a post about applying "unanswered" and "answered" classes to questions.

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
3 years 9 months ago #97697 by jaytsang
jaytsang replied the topic: Change color of chosen answer....
Hi, thanks for replying. but I tried to inject the code in the template.js, but unfortantely it didn't work. I am using imagetick.js script to control the shape of the answers (especially radio buttons, and checkboxes).

is there any advice???

Please Log in to join the conversation.

More
3 years 9 months ago #97713 by DenisChenu
DenisChenu replied the topic: Change color of chosen answer....
Hello,

This part:
input.radio:checked + label,input.checkbox:checked + label{
color:red;
}
is for template.css.

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

More
3 years 9 months ago #97723 by jaytsang
jaytsang replied the topic: Change color of chosen answer....
Hi Denis,
i tried the code you gave me but nothing cahnged. I put it at the end of the "template.css" file.


also, Tpartner;
I tried the code in " www.limesurvey.org/en/forum/design-issue...k-mark-when-answered "; it is not cahnged.

any help???

Please Log in to join the conversation.

More
3 years 9 months ago #97725 by DenisChenu
DenisChenu replied the topic: Change color of chosen answer....

ts2k13 wrote: Hi Denis,
i tried the code you gave me but nothing cahnged. I put it at the end of the "template.css" file.

Provide a test link (a survey activated with this template).

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

More
3 years 9 months ago #97830 by jaytsang
jaytsang replied the topic: Change color of chosen answer....
Hi Denis,
How can I provide a test link? I tried to do it but unfortiantley I couldn't.

regards,

Please Log in to join the conversation.

More
3 years 9 months ago #97840 by DenisChenu
DenisChenu replied the topic: Change color of chosen answer....
Hello,

Create a "simple survey" with only one or 2 question ( one single choice question radio button).
Put the template you made for this survey
Activate the survey
Send us the link for access to this survey.

A test link : limesurvey.sondages.pro/975921/lang-fr

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

More
3 years 4 months ago #102838 by dweisser
dweisser replied the topic: Change color of chosen answer....
Hi there,

With regard to this:

Hello,

This part:
input.radio:checked + label,input.checkbox:checked + label{
color:red;
}
is for template.css.

- which works perfectly, does anyone know how you might extend the style to encompass the entire li where the answer is found? I'm using ImageTick with multi-opt question type...

<li id="javatbd171641X190X1314SQ001" class="question-item answer-item checkbox-item">
<img src="/survey/upload/templates/Clear_logo_Clone/check.png" alt="no_tick" class="checkboxes" id="tick_img_answer171641X190X1314SQ001" style="opacity: 1;"><input class="checkbox" type="checkbox" name="171641X190X1314SQ001" id="answer171641X190X1314SQ001" value="Y" onclick="cancelBubbleThis(event);checkconditions(this.value, this.name, this.type)" style="position: absolute; left: -99999px;">
<label for="answer171641X190X1314SQ001" class="answertext">Completeness of communication</label>
<input type="hidden" name="java171641X190X1314SQ001" id="java171641X190X1314SQ001" value="Y">
</li>

Any advice would be appreciated.

Please Log in to join the conversation.

More
3 years 4 months ago #102843 by tpartner
tpartner replied the topic: Change color of chosen answer....
Hi David,

There is no way to select a parent of an element with CSS.

You will need to modify all of the listeners in imagetick_lime.js to add a class to the parent <li> element when a radio or checkbox is checked. Something like:
$('#tick_img_'+id).closest('li').addClass('checkedItem');

And then in template.css, something like this:
li.checkedItem {
	color:red;
}

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
3 years 4 months ago #102849 by dweisser
dweisser replied the topic: Change color of chosen answer....
I'll give it a shot. Thank you!

Please Log in to join the conversation.

More
3 years 4 months ago #102854 by DenisChenu
DenisChenu replied the topic: Change color of chosen answer....
:checked like this can be used only with css.

Here you need JS.

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in to join the conversation.

More
3 years 4 months ago #102866 by dweisser
dweisser replied the topic: Change color of chosen answer....
Thanks again guys,

I accomplished this by adding:

$('#tick_img_'+id).closest('li').addClass('uncheckedItem');
$('#tick_img_'+id).closest('li').removeClass('checkedItem');

and

$('#tick_img_'+id).closest('li').addClass('checkedItem');
$('#tick_img_'+id).closest('li').removeClass('uncheckedItem');

As you suggested. I hope it helps someone.
David

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now