- Posts: 16
- Thank you received: 3
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Assigning new class to question using JavaScript and question code placeholder
- eirikat
- Topic Author
- Offline
- New Member
Less
More
8 years 8 months ago #122706
by eirikat
Assigning new class to question using JavaScript and question code placeholder was created by eirikat
I was hoping to be able to add the question code as a new class to each of the questions in a survey, so that I can format the questions individually without using the question ID (which requires me to update template.css each time I make a new version of the survey). This script allows me to add a new class, but needs to be modified for each question:
As you see, the placeholder {QID} may be used for question ID. However, I have not been able to find a placeholder that works for question code. None of the question-related placeholders listed in the
EM Roadmap
provide the information I need. Many of them, such as {QUESTION_CODE}, seem not to be working in this context.
I'd appreciate your help in finding a placeholder I can use. Alternatively, any other way of implementing question-specific styling that is not broken upon copy/update would work for me
Thanks,
Code:
<script type="text/javascript" charset="utf-8_general_ci"> $(document).ready(function(){ $('#question{QID}').addClass('Potatoes'); // "Potatoes" would be the question code for this particular question }); </script>
I'd appreciate your help in finding a placeholder I can use. Alternatively, any other way of implementing question-specific styling that is not broken upon copy/update would work for me
Thanks,
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13907
- Thank you received: 2546
8 years 8 months ago #122708
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Assigning new class to question using JavaScript and question code placeholder
Hi,
{QUESTION_CODE} is added only if you set "Show question number and/or code: " to both or Question Code Only in survey settings.
After you can use it in your template
manual.limesurvey.org/Survey_settings#Pr...ation_.26_navigation
class="{QUESTION_CODE} {MANDATORY_CLASS}....
{QUESTION_CODE} is added only if you set "Show question number and/or code: " to both or Question Code Only in survey settings.
After you can use it in your template
manual.limesurvey.org/Survey_settings#Pr...ation_.26_navigation
class="{QUESTION_CODE} {MANDATORY_CLASS}....
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The following user(s) said Thank You: eirikat
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10611
- Thank you received: 3690
8 years 8 months ago - 8 years 8 months ago #122709
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Assigning new class to question using JavaScript and question code placeholder
If you enable "Show question number and/or code", you can use the {QUESTION_CODE} placeholder. So, you can do something like this in question.pstpl, which will add a class like "question-code-Potatoes".
Code:
<div {QUESTION_ESSENTIALS} class="question-wrapper {QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS}{if(!is_empty(QUESTION_CODE),' question-code-'+QUESTION_CODE, '')}">
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 8 years 8 months ago by tpartner.
The topic has been locked.
- eirikat
- Topic Author
- Offline
- New Member
Less
More
- Posts: 16
- Thank you received: 3
8 years 8 months ago #122714
by eirikat
Replied by eirikat on topic Assigning new class to question using JavaScript and question code placeholder
Thanks, DenisChenu, I was hoping there would be a simple solution to this. After enabling "Show question code", the following script works (as inserted into question source):
Code:
<script type="text/javascript" charset="utf-8_general_ci"> $(document).ready(function(){ $('#question{QID}').addClass('{QUESTION_CODE}'); }); </script>
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10611
- Thank you received: 3690
8 years 8 months ago #122716
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Assigning new class to question using JavaScript and question code placeholder
I don't understand using JavaScript here - that will require inserting in all questions, all languages. Modifying question.pstpl will automatically handle that.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The following user(s) said Thank You: eirikat
The topic has been locked.
- eirikat
- Topic Author
- Offline
- New Member
Less
More
- Posts: 16
- Thank you received: 3
8 years 8 months ago #122717
by eirikat
Replied by eirikat on topic Assigning new class to question using JavaScript and question code placeholder
And thank you, tpartner, your solution is even slicker!
Simply adding {QUESTION_CODE} to the first line in question.pstpl adds the question code as a new class for each of the questions in the survey. My first line now looks like this (note that I added a space to separate the question code class from previous classes):
Now I won't have to add scripts to each of the questions, I'll simply call my questions directly in template.css. Smooth!
Simply adding {QUESTION_CODE} to the first line in question.pstpl adds the question code as a new class for each of the questions in the survey. My first line now looks like this (note that I added a space to separate the question code class from previous classes):
Code:
<div {QUESTION_ESSENTIALS} class="{QUESTION_CLASS}{QUESTION_MAN_CLASS}{QUESTION_INPUT_ERROR_CLASS} {QUESTION_CODE}">
The topic has been locked.
- eirikat
- Topic Author
- Offline
- New Member
Less
More
- Posts: 16
- Thank you received: 3
8 years 8 months ago - 8 years 8 months ago #122718
by eirikat
Sorry, tpartner, I just wasn't quick enough to respond. Both of the solutions are potentially useful, but I would prefer yours in my case. Especially since I do handle a lot of different languages in this particular survey!
If you only need to edit a few questions, DenisChenu's solution works well, and you don't have to edit question.pstpl (I suppose that might matter in some cases, due to permissions)
Replied by eirikat on topic Assigning new class to question using JavaScript and question code placeholder
tpartner wrote: I don't understand using JavaScript here - that will require inserting in all questions, all languages. Modifying question.pstpl will automatically handle that.
Sorry, tpartner, I just wasn't quick enough to respond. Both of the solutions are potentially useful, but I would prefer yours in my case. Especially since I do handle a lot of different languages in this particular survey!
If you only need to edit a few questions, DenisChenu's solution works well, and you don't have to edit question.pstpl (I suppose that might matter in some cases, due to permissions)
Last edit: 8 years 8 months ago by eirikat.
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13907
- Thank you received: 2546
8 years 8 months ago #122719
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Assigning new class to question using JavaScript and question code placeholder
Think it's better to use question.pstpl too :whistle: but i leave less advice than Tonyclass="{QUESTION_CODE} {MANDATORY_CLASS}....
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The topic has been locked.