Welcome to the LimeSurvey Community Forum

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

Adding textbox in basic array

More
3 years 9 months ago #202555 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
I am not sure how do I trigger it? Would you have any suggestions or links to the solution for that? Apologies if my initial message wasn't clear. I would like to present the pop-up to my team as an added bonus.

Thank you for your help
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 9 months ago - 3 years 9 months ago #202567 by Joffm
Replied by Joffm on topic Adding textbox in basic array
Hi,you already found this solution, didn't you?
forums.limesurvey.org/forum/can-i-do-thi...ment-fields?start=15

I adapted the script by removing everything related to the array rows, put the button into the question text and got:




First the button (a simple bootstrap button):
Code:
<button class="btn btn-default btn-xs" data-backdrop="static" data-keyboard="false" data-target="#comments-{QID}-1" data-toggle="modal" type="button">Click to add a comment</button>

and the script:
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 qComments = qArray.nextAll('.text-long:lt('+arrayLength+')');
 
 
    // Add some classes
    qArray.addClass('array-with-comments-question');
    $(qComments).each(function(i) {
      $(this).addClass('comments-question index-'+i).css({
        'position': 'absolute',
        'left': '-9999em'
      });
    });
 
    // Handle comments
    $(qComments).each(function(i) {
      // Create modals
      $('body').append('<div class="modal comments-modal" id="comments-'+qArrayID+'-'+(i+1)+'" tabindex="-1" role="dialog">\
                <div class="modal-dialog" role="document">\
                  <div class="modal-content">\
                    <div class="modal-header">\
                      <h5 class="modal-title">'+$('.ls-label-question', this).html()+'</h5>\
                    </div>\
                    <div class="modal-body">\
                    </div>\
                    <div class="modal-footer">\
                      <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Okay</button>\
                      <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Clear</button>\
                    </div>\
                  </div>\
                </div>\
              </div>');
 
      // Move textareas into modals
      $('#comments-'+qArrayID+'-'+(i+1)+' .modal-body').append($('textarea', this));
 
      // Modal button events
      $('#comments-'+qArrayID+'-'+(i+1)+' .modal-footer .btn-secondary').on('click', function(e) {
        $('#comments-'+qArrayID+'-'+(i+1)+' textarea').val('');
      });
 
    });
 
    // Interrupt the Next/Submit function (to put comments back in the form)
    $('#limesurvey').submit(function(e) {
      $('.comments-modal[id^="comments-'+qArrayID+'-"]').each(function(i) {
        var qID = $('textarea:eq(0)', this).attr('id').split('X')[2];
        $('#question'+qID+' .answer-item:eq(0)').append($('textarea:eq(0)', this));
      });
    });  
  });
</script>

File Attachment:

File Name: limesurvey...5391.lss
File Size:22 KB


Joffm

The script can be simplified more ( there is only one comment); so no need to use the each-function.
But I am not familiar at all with javascript. It's only Amateurishness.
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 3 years 9 months ago by Joffm.
The following user(s) said Thank You: kratugoel
The topic has been locked.
More
3 years 8 months ago #203208 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
Hi

I am trying to implement this solution but I am not able to. Would you happen to have a sample survey depicting this solution? Thank you for the assistance.
The topic has been locked.
More
3 years 8 months ago #203209 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
Also how would any code change if I have to change my question type from the default array to array (numbers)?
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 8 months ago #203211 by tpartner
Replied by tpartner on topic Adding textbox in basic array

kratugoel wrote: Hi

I am trying to implement this solution but I am not able to. Would you happen to have a sample survey depicting this solution? Thank you for the assistance.

Joffm has already supplied a sample survey.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
3 years 8 months ago #203213 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
The sample survey provided is for the comment boxes. That works well for me so thank you for that. In that however, I was wondering how to implement the same comment box for array (numbers). Additionally, I was actually seeking a sample survey for the earlier solution provided by him where the large text box appears below the question(without the comment box).

Thank you
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 8 months ago #203219 by tpartner
Replied by tpartner on topic Adding textbox in basic array

I was wondering how to implement the same comment box for array (numbers)

This will implement Joffm's last solution in an array-numbers question:

Code:
Q1<br />
<button class="btn btn-default btn-xs" data-backdrop="static" data-keyboard="false" data-target="#comments-{QID}" data-toggle="modal" type="button">Click to add a comment</button> 
<script type="text/javascript" charset="utf-8">
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify the questions
    var qArrayID = {QID};
    var qArray = $('#question'+qArrayID);
    var qComments = qArray.nextAll('.text-long:eq(0)');
 
    // Add some classes
    qArray.addClass('array-with-comments-question');
    $(qComments).each(function(i) {
      $(this).addClass('comments-question index-'+i).css({
        'position': 'absolute',
        'left': '-9999em'
      });
    });
 
    // Create the modal
    $('body').append('<div class="modal comments-modal" id="comments-'+qArrayID+'" tabindex="-1" role="dialog">\
              <div class="modal-dialog" role="document">\
                <div class="modal-content">\
                  <div class="modal-header">\
                    <h5 class="modal-title">'+$('.ls-label-question', qComments).html()+'</h5>\
                  </div>\
                  <div class="modal-body">\
                  </div>\
                  <div class="modal-footer">\
                    <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Okay</button>\
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Clear</button>\
                  </div>\
                </div>\
              </div>\
            </div>');
 
    // Move textarea into modal
    $('#comments-'+qArrayID+' .modal-body').append($('textarea', qComments));
 
    // Modal button events
    $('#comments-'+qArrayID+' .modal-footer .btn-secondary').on('click', function(e) {
      $('#comments-'+qArrayID+' textarea').val('');
    });      
 
    // Interrupt the Next/Submit function (to put comments back in the form)
    $('#limesurvey').submit(function(e) {
      $('.answer-item:eq(0)', qComments).append($('#comments-'+qArrayID+' textarea:eq(0)'));
    });  
  });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...1(1).lss
File Size:22 KB
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: kratugoel
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 8 months ago #203220 by tpartner
Replied by tpartner on topic Adding textbox in basic array

Additionally, I was actually seeking a sample survey for the earlier solution provided by him where the large text box appears below the question(without the comment box).

You will need to be more specific - there are over 75 posts in this thread.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 8 months ago - 3 years 8 months ago #203221 by Joffm
Replied by Joffm on topic Adding textbox in basic array

I was actually seeking a sample survey for the earlier solution provided by him where the large text box appears below the question(without the comment box).


Well, here is the explanation again.
Use two questions, a questiomn of type array and a question of type "long text".

Give the array question a css class "myarray" and the text question a css class "mytext"
Add this css snippet.
Code:
<style type="text/css">
.mytext .question-title-container, .mytext .question-valid-container {
  display:none;
}
.myarray .question-container {
    margin-bottom: 0em;
}
</style>

Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 3 years 8 months ago by Joffm.
The following user(s) said Thank You: kratugoel
The topic has been locked.
More
3 years 8 months ago #203238 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
Thank you Joffm for sending the solution again. I will try it again. Was making some error earlier. Would this solution work for Array (numbers) as well? Or is there some modifications?
The topic has been locked.
More
3 years 8 months ago #203239 by kratugoel
Replied by kratugoel on topic Adding textbox in basic array
Thank you Tony Partner for sending the amended solution for array by numbers for the comment box.
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
3 years 8 months ago #203242 by Joffm
Replied by Joffm on topic Adding textbox in basic array
Why should it not work?
You have two questions.
And you do nothing else than hide the question container of the second question and remove the space between them.

So it is absolutely independent of the type of question.

But instead of asking this and wait for an answer, just try.

Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
The following user(s) said Thank You: kratugoel
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source