Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

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

Adding textbox in basic array

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 6 months ago - 6 years 6 months ago #170234 by tpartner
Replied by tpartner on topic Adding textbox in basic array
I would be inclined to use an array-texts type question and swap out some of the text inputs for checkbox inputs.

Add a script like this to the question source. The check-boxes will give a value of "Y" in the data when checked.

My time is limited this week so I will leave it to you to test the data and, perhaps, adjust styling.

Code:
<script type="text/javascript" charset="utf-8">
 
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
 
    // Insert checkboxes
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('custom-checkbox-item');
    $('.custom-checkbox-item', thisQuestion).each(function(i) {
      var thisID = $('input:text:eq(0)', this).attr('id');
      $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
      if($('input:text:eq(0)', this).val() == 'Y') {
        $('input:checkbox:eq(0)', this).prop('checked', true);
      }
      $(this).removeClass('text-item').addClass('checkbox-item');
      $('input:text:eq(0)', this).remove();
    });
 
    // Identify exclusive items
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5, .answer-item.column-6', thisQuestion).addClass('non-exclusive-item');
    $('.answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('exclusive-item');
 
    // Listeners for exclusive items
    $('.non-exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
      if($.trim($(this).val()) != '') {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        var thisItem = $(this).closest('.answer-item');
        $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
        $(this).closest('tr.subquestion-list').find('input:text').val('');
      }
    });
    });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...6-21.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:
Last edit: 6 years 6 months ago by tpartner.
The following user(s) said Thank You: krosser
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 6 months ago #170296 by krosser
Replied by krosser on topic Adding textbox in basic array
Wow! That is a great idea. :woohoo:
I have tested the code and it works nicely. You help is very much appreciated!
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 3 months ago #174270 by krosser
Replied by krosser on topic Adding textbox in basic array

tpartner wrote: I would be inclined to use an array-texts type question and swap out some of the text inputs for checkbox inputs.

Add a script like this to the question source. The check-boxes will give a value of "Y" in the data when checked.

My time is limited this week so I will leave it to you to test the data and, perhaps, adjust styling.

Code:
<script type="text/javascript" charset="utf-8">
 
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
 
    // Insert checkboxes
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('custom-checkbox-item');
    $('.custom-checkbox-item', thisQuestion).each(function(i) {
      var thisID = $('input:text:eq(0)', this).attr('id');
      $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
      if($('input:text:eq(0)', this).val() == 'Y') {
        $('input:checkbox:eq(0)', this).prop('checked', true);
      }
      $(this).removeClass('text-item').addClass('checkbox-item');
      $('input:text:eq(0)', this).remove();
    });
 
    // Identify exclusive items
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5, .answer-item.column-6', thisQuestion).addClass('non-exclusive-item');
    $('.answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('exclusive-item');
 
    // Listeners for exclusive items
    $('.non-exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
      if($.trim($(this).val()) != '') {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        var thisItem = $(this).closest('.answer-item');
        $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
        $(this).closest('tr.subquestion-list').find('input:text').val('');
      }
    });
    });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...6-21.lss
File Size:23 KB



Hi Tony,

Can you please help out with modifying this code so that only certain text inputs are swapped out for checkbox inputs?

I need to make this type of question:



See, the 1st column is only 3 first rows and the last one is kept as a text input for the "other".

The relevant part of your original code:
Code:
<script type="text/javascript" charset="utf-8">
 
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
 
    // Insert checkboxes
    $('.answer-item.column-1', thisQuestion).addClass('custom-checkbox-item');
    $('.custom-checkbox-item', thisQuestion).each(function(i) {
      var thisID = $('input:text:eq(0)', this).attr('id');
      $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
      if($('input:text:eq(0)', this).val() == 'Y') {
        $('input:checkbox:eq(0)', this).prop('checked', true);
      }
      $(this).removeClass('text-item').addClass('checkbox-item');
      $('input:text:eq(0)', this).remove();
    });
 
 
    });
</script>

File Attachment:

File Name: limesurvey...6125.lss
File Size:20 KB
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
Attachments:
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 3 months ago #174317 by tpartner
Replied by tpartner on topic Adding textbox in basic array
Try this:

Code:
    // Insert checkboxes
    $('.answer-item.column-1:lt(3)', thisQuestion).addClass('custom-checkbox-item');
    ...
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: krosser
The topic has been locked.
  • krosser
  • krosser's Avatar Topic Author
  • Offline
  • Elite Member
  • Elite Member
More
6 years 3 months ago #174332 by krosser
Replied by krosser on topic Adding textbox in basic array
Perfect! Thank you!
I wonder if that extra "lt" you added stands for "less than" or something else?
I'm using the latest LS 3.22 hosted on LS servers, not installed locally.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 3 months ago - 6 years 3 months ago #174335 by tpartner
Replied by tpartner on topic Adding textbox in basic array
Yes, :lt(3) targets elements with an index of less than 3. Since element indexing starts at 0, that targets all elements found before the fourth one.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 6 years 3 months ago by tpartner.
The following user(s) said Thank You: holch, krosser
The topic has been locked.
  • holch
  • holch's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 3 months ago #174344 by holch
Replied by holch on topic Adding textbox in basic array
Works like a charm! Saved for when I might need it one day. ;-)
I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
The topic has been locked.
More
4 years 8 months ago #197677 by Chrisou
Replied by Chrisou on topic Adding textbox in basic array
Hi, I'm very new to LimeSurvey and am now stuck at this point, where I'd like to use the format you generously provided - especially the horizontal one, with the options on the left and the response fields on the right and "other" on the far right. Since I'm not very well-versed in coding, I need further instructions on this, because if I just copy the whole script to the source of where it says "Question:" (after clicking "edit question"), nothing will show. Do I have to edit some settings or add the script somewhere else entirely?
I would really appreciate it if you (or someone else in this forum) would help me with this issue. Let me know if you need further details.
I'm using LimeSurvey online, if that makes any difference.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 8 months ago #197679 by Joffm
Replied by Joffm on topic Adding textbox in basic array
Hi, you answered to a thread that started more than 2 years ago, and contains a lot of different designs and scripts.

So, what exactly are you referring to?
As there are a lot of screenshots included, show us the one you want to achieve.

And: Of course, it is correct to include the script in the surce of the question, but sometimes more than one question are merged.

And, what version of LS are you using?

Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
More
4 years 8 months ago #197688 by Chrisou
Replied by Chrisou on topic Adding textbox in basic array
Sorry, I thought it would show which message I answered to.

I attached the screenshot of the array I would like to achieve, however mine should have 3 options on the left, 5 "written" answer options to click on (from "not at all" to "extremely" instead of 1-5) and one "other" option on the far right.

After trying the script tpartner provided on page 1 of the thread (#166909) on a new question instead of on the quesions I'd already programmed, I found that it does indeed work - although so far it only shows more circles where the comment option should be.
However, I discovered another issue: I would also like to include audio recordings in my questions, which should then be rated.
I found a workaround (see link), which has worked out fine with the array so far, but I am not sure it will work with the new script added: tsgdoc.socsci.ru.nl/index.php?title=Help:LimeSurvey/Demo_audio

I'm not entirely sure where to look up the LS version I'm using, since I haven't installed LS on my computer (only using the online tool), but I'm assuming it's 3.0, because I got a message in January welcoming me to that version of the template editor.
Attachments:
The topic has been locked.
  • holch
  • holch's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 8 months ago #197694 by holch
Replied by holch on topic Adding textbox in basic array

I'm not entirely sure where to look up the LS version I'm using, since I haven't installed LS on my computer (only using the online tool), but I'm assuming it's 3.0, because I got a message in January welcoming me to that version of the template editor.


The version of Limesurvey can usually be found on the bottom right corner of each screen in the Limesurvey administration.
I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 8 months ago #197695 by Joffm
Replied by Joffm on topic Adding textbox in basic array
Here a sample.

The first two groups may be of interest (G4 and G2).
The rest shows something else.

File Attachment:

File Name: limesurvey...4-22.lss
File Size:52 KB


Joffm

By the way: You find the version in the lower right corner of the GUI
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: Chrisou
The topic has been locked.
Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source