Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

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

Combined Array with large free text comment fields

More
11 years 4 months ago #120107 by spogue
Combined Array with large free text comment fields was created by spogue
Similar to other threads about combining an array question with a multiple short text question to provide for per-sub-question comments, I have a slightly different need.

We want to allow for essentially a notes section that could accommodate a larger amount of text than simply the short text input. In order to preserve real estate on the screen, I was envisioning using an indicator icon to launch a jquery dialog to provide the input field on-demand.

Has anyone done something similar before I dig into this myself?
The topic has been locked.
Partner Banner
More
11 years 4 months ago #120109 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
You can put the long-text questions into jQuery modal dialogs but that takes them out of the form so you need to make sure you interrupt the LimeSurvey form submit and put them back in the form. (The data will only be recorded if the question/textarea is in the form on submit.)
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
11 years 4 months ago #120135 by spogue
Replied by spogue on topic Combined Array with large free text comment fields
Thanks Tony, I understand the general approach but I was hoping to find some bits of skeletal code to extend on this since I'm a novice on jquery.
The topic has been locked.
More
11 years 4 months ago - 11 years 4 months ago #120141 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
Well, assuming you have one long-text for each array row and they directly follow the array question, adding something like this to the source of the array question should do the trick.

Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { // Identify the questions var qArray = $('#question{QID}'); 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); }); // Insert the comments buttons $('table.questions-list col', qArray).removeAttr('width'); $('table.questions-list thead tr', qArray).append('<td />'); $('tr.answers-list', qArray).each(function(i) { $(this).append('<td><button class="comment-button" type="button" data-index="'+i+'">Comments</button></td>'); }); // Put the comments questions into modal dialogs $(qComments).dialog({ autoOpen: false, width: 620, modal: true, resizable: false, draggable: false, closeOnEscape: true }); // Click events for comments buttons $('.comment-button').click(function() { var thisIndex = $(this).attr('data-index'); $('.comments-question.index-'+thisIndex).dialog('open'); }); // Interrupt the Next/Submit function (to put comments back in the form) $('#movenextbtn, #movesubmitbtn').bind('click', function () { qComments.hide(); $('#limesurvey').append(qComments); }); }); </script>

Here's a working sample survey:

File Attachment:

File Name: limesurvey...84-2.lss
File Size:19.83 KB
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 11 years 4 months ago by tpartner.
The following user(s) said Thank You: duvemyster
The topic has been locked.
More
11 years 4 months ago #120147 by spogue
Replied by spogue on topic Combined Array with large free text comment fields
Fantastic! Thanks Tony!

I'll extend it from there. Is there any reason/limitation that I couldn't use multiple short text question given I would be extending the real estate using the modals? It may make question management alittle easier.
The topic has been locked.
More
11 years 4 months ago #120148 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
No reason not to use a multiple-short-text but I thought the goal was to have textareas, not text inputs.
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
11 years 4 months ago #120149 by spogue
Replied by spogue on topic Combined Array with large free text comment fields
Yes, you're right....forgot that the short text was input vs textareas.
The topic has been locked.
More
8 years 9 months ago #161483 by duvemyster
Replied by duvemyster on topic Combined Array with large free text comment fields
Is "Esc" the intended way to return to array input after entry (ver 2.72+)?
The topic has been locked.
More
8 years 9 months ago #161486 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
Sorry, I don't understand the 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.
More
8 years 9 months ago #161489 by duvemyster
Replied by duvemyster on topic Combined Array with large free text comment fields
Thank you for your reply. I should have been more specific, and will clarify below.

When I apply the javascript in reply #120141 or look at the working sample survey provided with it, the Comments button leads to a pop-up textarea for comment entry. I see that Esc works in Version 2.72.5 to continue back to the array after entering a comment in the pop-up textarea. Is that what is intended as long as it's not being entered from a device without an Esc key?
The topic has been locked.
More
8 years 9 months ago #161554 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
This workaround is almost 3 years old and was never intended for mobile devices.

You would need to add a "Close" button to the long-text questions. Unfortunately, I don't have time now to offer code for that.
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: duvemyster
The topic has been locked.
More
8 years 9 months ago #161867 by duvemyster
Replied by duvemyster on topic Combined Array with large free text comment fields
Thank you. I was able to borrow from the file-upload dialog window to add in a Save Changes button.
The topic has been locked.
More
8 years 9 months ago #161868 by tpartner
Replied by tpartner on topic Combined Array with large free text comment fields
Nice. Can you share your code?
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
8 years 9 months ago #161869 by duvemyster
Replied by duvemyster on topic Combined Array with large free text comment fields
Certainly. I haven't used it in production yet, but it is working as intended in tests so far. Feel free to improve and/or re-direct. It's nothing fancy.

Just before the closing line of the section following "//Add some classes," I added:
$(this).append('<div class="modal-footer file-upload-modal-footer"><button class="comment-btn btn btn-success" type="button">Save changes</button></div>');

And then I added a second click event after the "// Click events for comments buttons" comment:
$('.comment-btn').click(function() {
$(qComments).dialog('close');
});
The following user(s) said Thank You: tpartner
The topic has been locked.
More
8 years 4 months ago #168785 by duvemyster
Replied by duvemyster on topic Combined Array with large free text comment fields
Any thoughts on adapting this for 3.x?
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