Welcome to the LimeSurvey Community Forum

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

Combine array question with comment box

  • ICDD2018
  • ICDD2018's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 8 months ago #186989 by ICDD2018
Combine array question with comment box was created by ICDD2018
I know this question has been asked before, but the javascripts I found do not work for me, maybe because they were meant for other LS versions?

I am using LS 3.17, and I would like to add a comment box to each subquestion in an array. I attached the survey questions. I would like every row to have a comment box for optional comments.

Can anyone help me with the right script to use?

Thanks!
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 8 months ago - 4 years 8 months ago #186993 by Joffm
Replied by Joffm on topic Combine array question with comment box
Hi,
there are several solutions in the forum.
Here:
www.limesurvey.org/forum/can-i-do-this-w...-text-comment-fields
and
www.limesurvey.org/forum/can-i-do-this-w...xtbox-in-basic-array
and
www.limesurvey.org/forum/can-i-do-this-w...rays?start=15#172238
(Though the topic is about "upload" the array also contains a simple text field)
And this example works in 3.x.
Just remove the "upload" part

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 8 months ago by Joffm.
The topic has been locked.
  • ICDD2018
  • ICDD2018's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 8 months ago #186994 by ICDD2018
Replied by ICDD2018 on topic Combine array question with comment box

Joffm wrote: Hi,
there are several solutions in the forum.
Here:
www.limesurvey.org/forum/can-i-do-this-w...-text-comment-fields
and
www.limesurvey.org/forum/can-i-do-this-w...xtbox-in-basic-array
and
www.limesurvey.org/forum/can-i-do-this-w...g-upload-with-arrays
(Though the topic is about "upload" the array also contains a simple text field)

Joffm



Thank you, I have seen these solutions, but they don't do exactly what I want to do, and I don't know how to change the script to make it work.
The topic has been locked.
  • ICDD2018
  • ICDD2018's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 8 months ago #186995 by ICDD2018
Replied by ICDD2018 on topic Combine array question with comment box
Okay, I removed the parts of the script that I was sure were about the upload button, but I still need some help. I can't figure out which parts of the script under "insert upload buttons and a column for the text inputs" are related to the buttons (so I should delete those), and which parts are about the text inputs. Any help please?
Code:
<script type="text/javascript" charset="utf-8">
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify the questions
    var qArrayID = {QID};
    var qArray = $('#question'+qArrayID);
    var arrayLength = $('tr.answers-list', qArray).length;
    var qMultiText = qArray.nextAll('.multiple-short-txt:eq(0)');
 
 
    // Hide the multi-short-text question
    $(qMultiText).hide();
 
 
    // Insert the "Upload" buttons and a column for the text inputs
    $('table.questions-list colgroup', qArray).append('<col />');
    var tableWidth = $('table.questions-list:eq(0)', qArray).width();
    var answerWidth = $('col.ls-col-odd:eq(0)', qArray).width();
    var answerWidthPercent = (answerWidth/tableWidth)*100;
    var answersLength = $('col.ls-col-odd, col.ls-col-even', qArray).length;
    var answerWidthPercent2 = (answerWidthPercent*answersLength)/(answersLength+2)
    $('table.questions-list col', qArray).removeAttr('width');
    $('table.questions-list col:not(.col-answers)', qArray).css('width', answerWidthPercent2+'%');
    $('table.questions-list col:not(.col-answers)', qArray).css('width', 'auto');
    $('table.questions-list thead tr', qArray).append('<th class="answer-text inserted-column-label" /><td />');
    $('tr.answers-list', qArray).each(function(i) {
      $(this).append('<td class="answer-item text-item">\
              </td>\
              <td class="answer-item">\
                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#upload-'+qArrayID+'-'+(i+1)+'" data-backdrop="static" data-keyboard="false">Upload</button>\
              </td>');
    });
 
    // Load the column label for the text inputs
    $('.inserted-column-label:eq(0)', qArray).text($('.ls-label-question', qMultiText).text());
    $('.text-item', qArray).prepend('<label class="ls-label-xs-visibility">'+$('.ls-label-question', qMultiText).text()+'</label>')
 
    // Loop through the multi-short-text sub-questions
    $('li.answer-item', qMultiText).each(function(i) {
      // Move the text inputs into the array
      $('input[type="text"]', this).appendTo($('tr.answers-list:eq('+i+') .text-item', qArray));
    });
 
 
 
  });
</script>
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 8 months ago #187006 by Joffm
Replied by Joffm on topic Combine array question with comment box
Well,
same for me.
I have not the least experience with javascript, but at least I can read the scripts provided by tpartner (they are well documented) and try to change something.

Here is what I found:
Code:
<script type="text/javascript" charset="utf-8">
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify the questions
    var qArrayID = {QID};
    var qArray = $('#question'+qArrayID);
    var qMultiText = qArray.nextAll('.multiple-short-txt:eq(0)');
 
    // Add some classes
    qArray.addClass('array-with-uploads-question');
 
      // Hide the multi-short-text question
    $(qMultiText).hide();
 
    $('table.questions-list col:not(.col-answers)', qArray).css('width', 'auto');
 
                $('table.questions-list thead tr', qArray).append('<th class="answer-text inserted-column-label" /></th>');
 
    $('tr.answers-list', qArray).each(function(i) {
      $(this).append('<td class="answer-item text-item">\
              </td>\
              ');
    });
 
    // Load the column label for the text inputs
    $('.inserted-column-label:eq(0)', qArray).text($('.ls-label-question', qMultiText).text());
    $('.text-item', qArray).prepend('<label class="ls-label-xs-visibility">'+$('.ls-label-question', qMultiText).text()+'</label>')
 
    // Loop through the multi-short-text sub-questions
    $('li.answer-item', qMultiText).each(function(i) {
      // Move the text inputs into the array
      $('input[type="text"]', this).appendTo($('tr.answers-list:eq('+i+') .text-item', qArray));
    });
 
  });
</script>




Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: tpartner
The topic has been locked.
  • ICDD2018
  • ICDD2018's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 8 months ago #187028 by ICDD2018
Replied by ICDD2018 on topic Combine array question with comment box
Thank you so much! This is exactly what I needed! I will study your script and what I had, so I'll hopefully learn a bit more about javascript.
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose