Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Single choice with answer options in a box

  • vzyldd
  • vzyldd's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
4 years 10 months ago #184033 by vzyldd
I need to create a question (as per image). It has three answer options depicting different scenarios. For scenario 1 I get the answers from a previous question. This is no issue. How do I display this question as close to the format in my image. The respondent only have to choose one of the scenarios (single answer). I tried single choice question (list) but I can't get the spacing to work. Any help/direction on how to do this greatly appreciated.

I am using Version 3.17.2+190408
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 10 months ago - 4 years 10 months ago #184037 by Joffm
Replied by Joffm on topic Single choice with answer options in a box
Hi,
to achieve what you would like to do you can use a question of type array.
As answer options create tables and to get the text in the upper left cell, read this:
www.limesurvey.org/forum/can-i-do-this-w...able-cells-in-arrays
Here the idea, style with css:


Or you use this example
www.limesurvey.org/forum/can-i-do-this-w...dels?start=15#170368



Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 10 months ago by Joffm.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 10 months ago #184039 by Joffm
Replied by Joffm on topic Single choice with answer options in a box
Here the solution of other post ( BANANAS | GREEN APPLES) adapted:


Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: vzyldd
The topic has been locked.
  • vzyldd
  • vzyldd's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
4 years 10 months ago #184040 by vzyldd
Replied by vzyldd on topic Single choice with answer options in a box
Big thank you Joffm. This is perfect.
The topic has been locked.
More
4 years 1 month ago #194407 by ILYES22
Replied by ILYES22 on topic Single choice with answer options in a box
unfortunately for me, the radio buttons do not appear. I had something like this

Thank you for help
The topic has been locked.
More
4 years 1 month ago #194408 by ILYES22
Replied by ILYES22 on topic Single choice with answer options in a box
unfortunately for me, the radio buttons do not appear
below the table.

thank you for help
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 1 month ago #194410 by Joffm
Replied by Joffm on topic Single choice with answer options in a box
Hi,
I tested in 4.1.5. to make sure. Everything's fine.

What I see is a HTML tag "<" at the beginning of your question.
So you should revise your code.

No more without seeing your lss.

Best regards
Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
More
4 years 1 month ago #194418 by ILYES22
Replied by ILYES22 on topic Single choice with answer options in a box
Thank you for the quick replay Joffm

i don't have have a spécial lss.
when i copy the code of the link www.limesurvey.org/forum/can-i-do-this-w...dels?start=15#170368 . i get a table without radio buttons. and when i import the lss attached to the same code in same link, i get a table with only one button radio. as you can see in the pictureS below

thank you for help
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 1 month ago #194423 by Joffm
Replied by Joffm on topic Single choice with answer options in a box
You have create your lss export.

So, please, create it and attach it here.

But it looks as if you didn't set the answer options.

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
More
4 years 1 month ago #194427 by ILYES22
Replied by ILYES22 on topic Single choice with answer options in a box
Thank you for the replay Joffm

my lss is attached here.

Note: I am a beginner in limesurvey and java code is not my field.

Thank you
The topic has been locked.
More
4 years 1 month ago #194428 by ILYES22
Replied by ILYES22 on topic Single choice with answer options in a box
You will find the problem of the buttons in the last question of the survey
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 1 month ago - 4 years 1 month ago #194429 by Joffm
Replied by Joffm on topic Single choice with answer options in a box
Hi,
1. in the second post of this thread you read

to achieve what you would like to do you can use a question of type array.

But you do not use a question of type array, but a "list(radio)".

2. And in this thread
www.limesurvey.org/forum/can-i-do-this-w...dels?start=15#170368
the javascript is like this
Code:
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
  <tbody>
    <tr>
      <td style="text-align: center;" width="0%"> </td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#D4D7E4" style="text-align: center;" width="40%"><br />
      <span style="font-size:24px;"><strong>BANANAS</strong></span><br />
       </td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#D4D7E4" style="text-align: center;" width="40%"><span style="font-size:24px;"><strong>GREEN APPLES</strong></span></td>
    </tr>
    <tr style="height: 6px; text-align: center;">
    </tr>
    <tr>
      <td bgcolor="#f2f2f2" style="text-align: center;">
      <p><span style="font-size:12px;"> </span><br />
      <span style="font-size:18px;">Type of Vitamins</span><span style="font-size:12px;"> </span></p>
      </td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;">
      <p> </p>
 
      <div><span style="font-size:20px;"><strong>XX</strong></span></div>
 
      <p> </p>
      </td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;"><span style="font-size:20px;"><strong>XXXX</strong></span></td>
    </tr>
    <tr style="height: 6px; text-align: center;">
    </tr>
    <tr>
      <td bgcolor="#f2f2f2" style="text-align: center;"><span style="font-size:18px;">Hidratos</span></td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;">
      <p><span style="font-size:20px;"><strong>SUGAR</strong></span><br />
      <br />
      <span style="font-size:16px;">Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla bla blabla .</span></p>
      </td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2">
      <p style="text-align: center;"><span style="font-size: 20px;"><b>ACID JUICE</b></span><br />
      <span style="font-size:16px;">Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla blabla bla bla  bla bla bla bla bla bla blabla .</span></p>
      </td>
    </tr>
    <tr>
      <td bgcolor="#f2f2f2" style="text-align: center;"><span style="font-size:18px;">Price</span></td>
      <td style="text-align: center;" width="1%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;"><br />
      <b>1 Kg - 1</b><br />
       </td>
      <td style="text-align: center;" width="1%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;"><strong>1Kg - 0.95</strong></td>
    </tr>
    <tr style="height: 6px; text-align: center;">
      <td colspan="5"></td>
    </tr>
    <tr>
      <td bgcolor="#f2f2f2" style="text-align: center;"></td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2" style="text-align: center;"></td>
      <td style="text-align: center;" width="0%"> </td>
      <td bgcolor="#f2f2f2"></td>
    </tr>
  </tbody>
</table>
<script type="text/javascript" charset="utf-8">
 
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Move the radios
    $('.question-text table:eq(0) tr:last td:eq(2)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(0) *', thisQuestion));
    $('.question-text table:eq(0) tr:last td:eq(4)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(1) *', thisQuestion));
 
    // Some classes for presentation
    $('.question-text table:eq(0) input:radio', thisQuestion).closest('td').addClass('answer-item radio-item text-center radio');
    $('.question-text table:eq(0) .radio-item label', thisQuestion).show();
 
    // Click event on the table cells
    $('.question-text table:eq(0) .radio-item', thisQuestion).on('click', function(e) {
      $('input:radio', this).trigger('click');
    });
    $('.question-text table:eq(0) input:radio', thisQuestion).on('click', function(e) {
      e.stopPropagation();
    });
 
    // Clean-up styles
    $('.answer-container', thisQuestion).hide();
    $('.question-text table:eq(0) .label-text', thisQuestion).remove();
    $('.question-text table:eq(0) .radio-text', thisQuestion).css({
      'cursor': 'pointer'
    });
    });
</script>
In your script these two lines are commented
//$('.question-text table:eq(0) tr:last td:eq(2)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(0) *', thisQuestion));
//$('.question-text table:eq(0) tr:last td:eq(4)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(1) *', thisQuestion));
Remove the slashes or copy the entire script again.

3. There is still the leading "<" in the script, before "<table>". Remove it, too.

Joffm

And here the revised survey sample

File Attachment:

File Name: limesurvey...7922.lss
File Size:30 KB

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 1 month ago by Joffm.
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose