Array Question with "Other" Answer

More
2 years 9 months ago #116018 by jake1729
jake1729 replied the topic: Array Question with "Other" Answer
Thank you, this is great. How would you expand this so that you could have multiple "Other" inputs (say 3)?

I really appreciate your help.

Please Log in to join the conversation.

More
2 years 9 months ago - 2 years 9 months ago #116021 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
Try this:

<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function() {
 
		// Identify the questions
		var thisQuestion = $('#question'+{QID}+'');
		var nextQuestion1 = $(thisQuestion).nextAll('.text-short:eq(0)');
		var nextQuestion2 = $(thisQuestion).nextAll('.text-short:eq(1)');
		var nextQuestion3 = $(thisQuestion).nextAll('.text-short:eq(2)');
		var nextQuestions = $(nextQuestion1).add(nextQuestion2).add(nextQuestion3);
		var nextLength = nextQuestions.length;
		var sqLength = ('tr.answers-list', thisQuestion).length;
 
		// Hide the short-text questions
		$(nextQuestions).hide();
 
		// Move the hidden text inputs into the array
		for (i = 0; i < nextLength; i++) {
			var workingIndex = (sqLength - 1) - (nextLength - i);
			var nextQ = nextQuestions[i];
			$('th.answertext:eq('+workingIndex+')', thisQuestion).append($('input[type="text"]', nextQ)).closest('tr').addClass('otherRow');
		}	
 
		// Some styling...
		$('input[type="text"]', thisQuestion).css({
			'width': '50%'
		});		
 
		// Handle the "Other" radios
		$('input[type="text"]', thisQuestion).on('keyup change',function(event){
			event.stopPropagation();
 
			var thisRow = $(this).closest('tr.answers-list');			
			if($.trim($(this).val()) == '') {
				$('input:radio[value!=""]', thisRow).prop('checked',false);
				$('input:radio[value=""]', thisRow).click();
			}
			else {
				$('input:radio[value=""]', thisRow).prop('checked',false);
			}
		});	
 
		// Handle the "Other" text inputs
		$('.otherRow input.radio', thisQuestion).on('click',function(event){
			var thisRow = $(this).closest('tr.answers-list');
			if($(this).attr('value') == '') {
				$('input[type="text"]', thisRow).val('');
			}
		});
 
		// Validate the "Other" text inputs on submit
		if($('#movenextbtn, #movesubmitbtn').attr('data-inserted-other') != 'true') { // We're only doing this once on this page
			$('#movenextbtn, #movesubmitbtn').attr('data-inserted-other', 'true').on('click.insertedOther', function (event) {
 
				var otherError = 0;
 
				$('.array-flexible-row .otherRow').each(function(i) {
 
					if(($('input:radio[value!=""]:checked', this).length > 0 && $('input[type="text"]', this).val() == '') || ($('input:radio[value!=""]:checked', this).length == 0 && $('input[type="text"]', this).val() != '')) {
						otherError = 1;
					}
				});
 
				if(otherError == 1) {
					alert('Please review your answer in the "Other" row(s).');
					return false;
				}
			});
		}
	});
</script>


File Attachment:

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



Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last Edit: 2 years 9 months ago by tpartner.

Please Log in to join the conversation.

More
2 years 8 months ago - 2 years 8 months ago #116830 by first
first replied the topic: Array Question with "Other" Answer
Hi tpartner,

It would great if we can do one more enhancement in this code.

This code works perfect when Array question in non-mandatory but if I make Array question mandatory from question setting then "OtherSpecify" row also forced to answer that is usually not desired. My plan is to keep Array question non-mandatory through settings and update javascript code to force all rows except other specify. Also the UI on error should also be similar default error ie append an error message "This question is mandatory. Please complete all parts." below question text and red highlight the labels of rows that are not answered.

Can you please help us ... :)

Thanks

Survey Designer and Programmer
Last Edit: 2 years 8 months ago by first. Reason: typo

Please Log in to join the conversation.

More
2 years 8 months ago - 2 years 8 months ago #116839 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
The way that I would handle that would be to...

1) Keep the mandatory setting on the question.

2) Add an "N/A" answer to the y-scale.

3) Add the following new script that will:
- Insert the "Other" input as previously
- Hide the "N/A" column
- Click the hidden "N/A" radio by default
- If text is entered in "Other", the hidden "N/A" is unchecked
- If all text is removed fromn "Other", the hidden "N/A" is checked

Now the hidden "N/A" can satisfy the mandatory requirement if nothing is entered in "Other".

Note that this script will not work on the same page as previous scripts from this thread without modification to those previous scripts.

<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function() {
 
		// Identify the questions
		var thisQuestion = $('#question'+{QID}+'');
		var nextQuestion = $(thisQuestion).nextAll('.text-short:eq(0)');
 
		// Hide the short-text question
		$(nextQuestion).hide();
 
		// Add a class to the "N/A" column
		$('table.subquestions-list thead tr th:last', thisQuestion).addClass('na-column');
		$('table.subquestions-list tbody tr', thisQuestion).each(function(i) {
			$('td:last', this).addClass('na-column');
		});
 
		// Hide the "N/A" column
		$('.na-column', thisQuestion).hide();
		var ansColWidth = Number($('.col-answers', thisQuestion).attr('width').replace(/%/, ''));
		var newColWidth = (100-ansColWidth)/($('col.odd, col.even', thisQuestion).length-1);
		$('col.odd, col.even', thisQuestion).attr('width', newColWidth+'%');
 
		// Move the hidden text input into the array
		$('th.answertext:last', thisQuestion).append($('input[type="text"]', nextQuestion)).closest('tr').addClass('otherRow');
 
		// Initial "N/A" radio setting
		if($('.otherRow input:radio:checked', thisQuestion).length == 0) {
			$('.otherRow .na-column input:radio', thisQuestion).trigger('click');
		}
 
		// Some styling...
		$('input[type="text"]', thisQuestion).css({
			'width': '50%'
		});		
 
		// Handle the "Other" radios
		$('input[type="text"]', thisQuestion).on('keyup change',function(event){
			event.stopPropagation();
 
			if($.trim($(this).val()) == '') {
				$('.otherRow input:radio', thisQuestion).prop('checked',false);
				$('.otherRow .na-column input:radio', thisQuestion).click();
			}
			else {
				$('.otherRow .na-column input:radio', thisQuestion).prop('checked',false);
			}
		});	
	});
</script>

File Attachment:

File Name: limesurvey...st_8.lss
File Size:19 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last Edit: 2 years 8 months ago by tpartner.
The following user(s) said Thank You: zeitweise

Please Log in to join the conversation.

More
2 years 4 months ago #121021 by jelo
jelo replied the topic: Array Question with "Other" Answer

tpartner wrote:

File Attachment:

File Name: limesurvey...st_8.lss
File Size:19 KB

Was the attachment revoked or is that a problem from the new website (which was introduced today)?

Please Log in to join the conversation.

More
2 years 4 months ago #121220 by jelo
jelo replied the topic: Array Question with "Other" Answer
Is there an elegant way to keep the others fields at the bottom when applying the randomize option?

Please Log in to join the conversation.

More
2 years 4 months ago #121265 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
To do that, you would need to have the JS move the "Other" sub-question to the end of the array before inserting the text input.

So, for example, if your "Other" sub-question has a code of "99", something like this:

<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function() {
 
		// Identify the questions
		var thisQuestion = $('#question'+{QID}+'');
		var nextQuestion = $(thisQuestion).nextAll('.text-short:eq(0)');
 
		// Hide the short-text question
		$(nextQuestion).hide();
 
		// Move the "Other" row to the end (in case of randomization)
		$('table.subquestions-list', thisQuestion).append($('tr.answers-list[id$="X'+{QID}+'99"]'));
 
		// Add a class to the "N/A" column
		$('table.subquestions-list thead tr th:last', thisQuestion).addClass('na-column');
		$('table.subquestions-list tbody tr', thisQuestion).each(function(i) {
			$('td:last', this).addClass('na-column');
		});
 
		// Hide the "N/A" column
		$('.na-column', thisQuestion).hide();
		var ansColWidth = Number($('.col-answers', thisQuestion).attr('width').replace(/%/, ''));
		var newColWidth = (100-ansColWidth)/($('col.odd, col.even', thisQuestion).length-1);
		$('col.odd, col.even', thisQuestion).attr('width', newColWidth+'%');
 
		// Move the hidden text input into the array
		$('th.answertext:last', thisQuestion).append($('input[type="text"]', nextQuestion)).closest('tr').addClass('otherRow');
 
		// Initial "N/A" radio setting
		if($('.otherRow input:radio:checked', thisQuestion).length == 0) {
			$('.otherRow .na-column input:radio', thisQuestion).trigger('click');
		}
 
		// Some styling...
		$('input[type="text"]', thisQuestion).css({
			'width': '50%'
		});		
 
		// Handle the "Other" radios
		$('input[type="text"]', thisQuestion).on('keyup change',function(event){
			event.stopPropagation();
 
			if($.trim($(this).val()) == '') {
				$('.otherRow input:radio', thisQuestion).prop('checked',false);
				$('.otherRow .na-column input:radio', thisQuestion).click();
			}
			else {
				$('.otherRow .na-column input:radio', thisQuestion).prop('checked',false);
			}
		});	
	});
</script>

File Attachment:

File Name: limesurvey...9988.lss
File Size:20 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
The following user(s) said Thank You: first

Please Log in to join the conversation.

More
2 years 4 months ago #121917 by first
first replied the topic: Array Question with "Other" Answer
I am not getting emails when this thread updates. I am already subscribed to it and its in my favorite thread list.

Survey Designer and Programmer

Please Log in to join the conversation.

More
2 years 4 months ago #121918 by jelo
jelo replied the topic: Array Question with "Other" Answer
I got a email about your post. And the last post before was 2 weeks ago.
Perhaps an issue on mailserver level.

But thanks for your post. I forgot to say "Thank you" to tpartner.
Shame on me. Have to reduce the threads I follow at the same time.
The following user(s) said Thank You: first

Please Log in to join the conversation.

More
2 years 4 months ago #121919 by first
first replied the topic: Array Question with "Other" Answer
Thanks ..Its fine now.. :) . Now I am getting emails ..

Survey Designer and Programmer

Please Log in to join the conversation.

More
2 years 1 week ago #127314 by zeitweise
zeitweise replied the topic: Array Question with "Other" Answer
Hi all, hi tpartner,

I am struggleing with this very problem.
My matrix has 9 lines and 6 option columns (1,2,3,4,5, "I have not encountered this"). I wish to add one or two lines for user input. The question shall be mandatory.
Unfortunately, the scripts you kindly provided do not produce the extra lines with input fields. (Scripting in general works in my instance, and the additional N/A column also appears.)
I would greatly appreciate any hint about how to solve this. Unfortunately, I have no JavaScript skills.

zeitweise

Please Log in to join the conversation.

More
2 years 1 week ago #127316 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
Does the supplied sample survey work?

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 years 1 week ago - 2 years 1 week ago #127318 by zeitweise
zeitweise replied the topic: Array Question with "Other" Answer
Yes, the file you provided in post #116839 works - three given option lines, one extra.
I could provide a screenshot of my logic file, if that helps?
Last Edit: 2 years 1 week ago by zeitweise.

Please Log in to join the conversation.

More
2 years 1 week ago #127353 by zeitweise
zeitweise replied the topic: Array Question with "Other" Answer
Hi, I am attaching my logic file here - hoping that this helps in identifying what I did wrong. It would be super nice to get help as I need to distribute the survey as soon as possible. Thanks!
Attachments:

Please Log in to join the conversation.

More
2 years 6 days ago #127372 by zeitweise
zeitweise replied the topic: Array Question with "Other" Answer

tpartner wrote: The way that I would handle that would be to...

1) Keep the mandatory setting on the question.

2) Add an "N/A" answer to the y-scale.

3) Add the following new script that will:
- Insert the "Other" input as previously
- Hide the "N/A" column
- Click the hidden "N/A" radio by default
- If text is entered in "Other", the hidden "N/A" is unchecked
- If all text is removed fromn "Other", the hidden "N/A" is checked

Now the hidden "N/A" can satisfy the mandatory requirement if nothing is entered in "Other".

File Attachment:

File Name: limesurvey...st_8.lss
File Size:19 KB


Thanks, the sample indeed helped me to adapt my survey. It almost works :)

Just one problem is left: As soon as I turn the question to "mandatory", the matrix changes. From the six columns I have, only five are displayed. My six columns are: 1, 2, 3, 4, 5, "I have not encountered this".
With the mandatory setting, only 1, 2, 3, 4, 5 are displayed.

I am attaching my survey below.

I would greatly appreaciate your help!!
Attachments:

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now