Welcome to the LimeSurvey Community Forum

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

Multiple choice table - Discrete choice Models

tpartner
Offline
LimeSurvey Community Team

More

7 years 7 months ago #155115 by tpartner

Replied by tpartner on topic Multiple choice table - Discrete choice Models

You have given the image width and height styles. Remove those in the HTML editor.

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

Attachments:

...2017-05-22.png

The topic has been locked.

Rexha
Topic Author
Offline
New Member

More

7 years 7 months ago #155186 by Rexha

Replied by Rexha on topic Multiple choice table - Discrete choice Models

Thank you very much for all the help

!!!

It's nicely working.

The topic has been locked.

Rexha
Topic Author
Offline
New Member

More

6 years 10 months ago #164697 by Rexha

Replied by Rexha on topic Multiple choice table - Discrete choice Models

Hello,

My LimeSurvey got updated to Versão 2.73.0+171219.

The solution gave has stopped working, thus I would like to know if in this version there is any new and easier way to get it done?

(Note: this time I just need users to select one of two columns).

The topic has been locked.

holch
Offline
LimeSurvey Community Team

More

6 years 10 months ago - 6 years 10 months ago #164703 by holch

Replied by holch on topic Multiple choice table - Discrete choice Models

I love it. So your organization just updated from a really, really old version of Limesurvey to another old version that received no support and no bug fixes anymore? I guess they'll upgrade to 3.x once 4.x is released... ;-)

Help us to help you!

Provide your LS version and where it is installed (own server, uni/employer, SaaS hosting, etc.).
Always provide a LSS file (not LSQ or LSG).

Note: I answer at this forum in my spare time, I'm not a LimeSurvey GmbH employee.

Last edit: 6 years 10 months ago by holch.

The following user(s) said Thank You: jeremt

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

6 years 10 months ago #164707 by tpartner

Replied by tpartner on topic Multiple choice table - Discrete choice Models

Use this for the JavaScript:

Code:

<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function(){
    var columnCount = $('#question{QID} table.subquestion-list thead tr:eq(0) > *').length;
    $('#question{QID} table.subquestion-list').addClass('custom-array-1');
    $('#question{QID} .no-more-tables').removeClass('no-more-tables');
    $('#question{QID} .answer-item .visible-xs-block.label-text').remove();
    $('#question{QID} table.subquestion-list thead tr:eq(0)').hide();
    $('#question{QID} table.subquestion-list thead').append('<tr class="inserted-row"><td colspan='+columnCount+'></td></tr>');
    $('#question{QID} table.subquestion-list .inserted-row td:eq(0)').html($('#question{QID} th.answertext:eq(0)').html());
    $('#question{QID} th.answertext:eq(0)').html('');
  });
</script>

And, this for the CSS:

Code:

table.custom-array-1 .inserted-row td {
  text-align: center;
  padding: 0;
}
 
table.custom-array-1 .inserted-row img {
  width: 100%;
}

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: jeremt

The topic has been locked.

Rexha
Topic Author
Offline
New Member

More

6 years 6 months ago - 6 years 6 months ago #170354 by Rexha

Replied by Rexha on topic Multiple choice table - Discrete choice Models

Hello,

So I have made a new questionnaire of Discrete choice.

However, now I have different problems than before.

The displacement between the question and the answer row is too big.
Aswell the tables display in phone screen sucks.

Here is a link with an example that I prepared:
surveys.uc.pt/index.php/488679?lang=pt

Basically i have inserted the table in the question infobox, then the subquestion field is empty ( and i think that's why there is a big space between the question and the answer row).

Regarding the display problem I have no idea, besides i don't have access to the platform programming files. Still, i have contacted the administrator and he told me that my LimeSurvey version is compatible with mobile phone display (LimeSurvey
Versão 2.73.0+171219).

Thanks in advance for any help or time spent on this subject.

Last edit: 6 years 6 months ago by Rexha.

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

6 years 6 months ago #170356 by tpartner

Replied by tpartner on topic Multiple choice table - Discrete choice Models

I think it will be almost impossible to get things to line up correctly on mobile devices if using separate tables. I would add another row to your info table and then use JavaScript to move the radios into that row.

Can you attach a small test survey containing only a single question?

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

The topic has been locked.

Rexha
Topic Author
Offline
New Member

More

6 years 6 months ago #170360 by Rexha

Replied by Rexha on topic Multiple choice table - Discrete choice Models

Here is a new link as requested, with only one question:
surveys.uc.pt/index.php/797519?lang=pt

I dunno that it will help, but this is my table 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%"> 
BANANAS 
</td>
<td style="text-align: center;" width="0%"> </td>
<td bgcolor="#D4D7E4" style="text-align: center;" width="40%">GREEN APPLES</td>
</tr>
<tr style="height: 6px; text-align: center;">
</tr>
<tr>
<td bgcolor="#f2f2f2" style="text-align: center;">
 
Type of Vitamins 
</td>
<td style="text-align: center;" width="0%"> </td>
<td bgcolor="#f2f2f2" style="text-align: center;">
 

<div>XX</div>

 
</td>
<td style="text-align: center;" width="0%"> </td>
<td bgcolor="#f2f2f2" style="text-align: center;">XXXX</td>
</tr>
<tr style="height: 6px; text-align: center;">
</tr>
<tr>
<td bgcolor="#f2f2f2" style="text-align: center;">Hidratos</td>
<td style="text-align: center;" width="0%"> </td>
<td bgcolor="#f2f2f2" style="text-align: center;">
SUGAR 
 
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 .
</td>
<td style="text-align: center;" width="0%"> </td>
<td bgcolor="#f2f2f2">
ACID JUICE 
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 .
</td>
</tr>
<tr>
<td bgcolor="#f2f2f2" style="text-align: center;">Price</td>
<td style="text-align: center;" width="1%"> </td>
<td bgcolor="#f2f2f2" style="text-align: center;"> 
1 Kg - 1€ 
</td>
<td style="text-align: center;" width="1%"> </td>
<td bgcolor="#f2f2f2" style="text-align: center;">1Kg - 0.95 €</td>
</tr>
</tbody>
</table>

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

6 years 6 months ago #170361 by tpartner

Replied by tpartner on topic Multiple choice table - Discrete choice Models

Can you please attach an export (.lss file) of a survey, not a link?

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

The topic has been locked.

Rexha
Topic Author
Offline
New Member

More

6 years 6 months ago #170362 by Rexha

Replied by Rexha on topic Multiple choice table - Discrete choice Models

There you go, and thank you for all the help.

Attachments:

...vey_797519.lss

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

6 years 6 months ago #170368 by tpartner

Replied by tpartner on topic Multiple choice table - Discrete choice Models

I would do something like this. You can see that I have added a row to the table in the question text and inserted a script to move the radios up into that row.

You may still need some CSS tweaks for phones in portrait mode but test as-is first.

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>

Here is your test survey back with those changes:

File Attachment:

File Name: limesurvey...5191.lss
File Size:23 KB

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

Attachments:

The topic has been locked.

tapinho
Offline
New Member

More

6 years 5 months ago #171479 by tapinho

Replied by tapinho on topic Multiple choice table - Discrete choice Models

Hey guys, I was trying to implement this code above, since I also need to create a discrete choice survey, but it does not quite look the same. The clickable dots underneath each option do not appear. I tried several options of question types, but none of them seem to do the trick.

I am using the Version 2.50+ Build 160620 in my browser which is made available by my university.

The topic has been locked.

Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Multiple choice table - Discrete choice Models

File Attachment:

Lime-years ahead

Legal

About Us

Open Source