Combined Array with large free text comment fields

Mehr
3 Jahre 5 Monate her #120107 von spogue
spogue erstellte das Thema Combined Array with large free text comment fields
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?

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her #120109 von tpartner
tpartner antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her #120135 von spogue
spogue antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her - 3 Jahre 5 Monate her #120141 von tpartner
tpartner antwortete auf das Thema: 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.

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

Dateianhang:

Dateiname: limesurvey...84-2.lss
Dateigröße:20 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Anhang:
Letzte Änderung: 3 Jahre 5 Monate her von tpartner.
Folgende Benutzer bedankten sich: duvemyster

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her #120147 von spogue
spogue antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her #120148 von tpartner
tpartner antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
3 Jahre 5 Monate her #120149 von spogue
spogue antwortete auf das Thema: Combined Array with large free text comment fields
Yes, you're right....forgot that the short text was input vs textareas.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 2 Wochen her #161483 von duvemyster
duvemyster antwortete auf das Thema: Combined Array with large free text comment fields
Is "Esc" the intended way to return to array input after entry (ver 2.72+)?

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 2 Wochen her #161486 von tpartner
tpartner antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 2 Wochen her #161489 von duvemyster
duvemyster antwortete auf das Thema: 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?

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 1 Woche her #161554 von tpartner
tpartner antwortete auf das Thema: 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.
Folgende Benutzer bedankten sich: duvemyster

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 3 Tage her #161867 von duvemyster
duvemyster antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 3 Tage her #161868 von tpartner
tpartner antwortete auf das Thema: 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.

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
10 Monate 3 Tage her #161869 von duvemyster
duvemyster antwortete auf das Thema: 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');
});
Folgende Benutzer bedankten sich: tpartner

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Mehr
5 Monate 6 Tage her #168785 von duvemyster
duvemyster antwortete auf das Thema: Combined Array with large free text comment fields
Any thoughts on adapting this for 3.x?

Bitte Anmelden oder Registrieren um an der Konversation teilzunehmen.

Jetzt loslegen!

Melden Sie sich jetzt an, und erstellen Sie in wenigen Minuten Ihre erste Umfrage.

Account einrichten

Abonnieren Sie unseren Newsletter

Abonnieren Sie unseren Newsletter für alle Neuigkeiten rund um LimeSurvey
captcha