Array Question with "Other" Answer

More
3 years 1 month ago #127394 by tpartner
tpartner replied the topic: Array Question with "Other" Answer

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

Please Log in or Create an account to join the conversation.

More
2 years 5 months ago #137713 by honorem
honorem replied the topic: Array Question with "Other" Answer

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



Is it possible to move the text box next to the radio buttons in for example column 1?

Please Log in or Create an account to join the conversation.

More
2 years 5 months ago - 2 years 5 months ago #137717 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
Untested, but 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).closest('tr').addClass('otherRow').find('input.radio:eq(0)').after($('input[type="text"]', nextQ));
		}	
 
		// 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>

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

Please Log in or Create an account to join the conversation.

More
2 years 5 months ago #137720 by honorem
honorem replied the topic: Array Question with "Other" Answer

tpartner wrote: Untested, but 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).closest('tr').addClass('otherRow').find('input.radio:eq(0)').after($('input[type="text"]', nextQ));
		}	
 
		// 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>


Works nicely, however, this will append on "input[type="text"]" which is the first column if I'm understanding the jquery right (I'm a beginner in jquery), what if someone would like to have it in the column 2 instead? I mean, is there a general way to specify in which column and row next to the radio button? Thanks for your nice answers!

Please Log in or Create an account to join the conversation.

More
1 year 1 month ago #158859 by blocka
blocka replied the topic: Array Question with "Other" Answer
I wonder, is there a way to do this with an Array (Text) type question -- a column for "No Answer", and a new row for "Other" with text input?

Please Log in or Create an account to join the conversation.

More
1 year 4 weeks ago #159841 by miguelvillegas88
miguelvillegas88 replied the topic: Array Question with "Other" Answer
hi, this can apply with multiple short text, for add more "OTHER´S" in Q1?

Please Log in or Create an account to join the conversation.

More
1 year 4 weeks ago #159846 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
I don't understand the question. The example above gives 3 "Other" inputs and can easily be expanded for more.

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

Please Log in or Create an account to join the conversation.

More
1 year 4 weeks ago #159853 by miguelvillegas88
miguelvillegas88 replied the topic: Array Question with "Other" Answer
im sorry, i was confused

Please Log in or Create an account to join the conversation.

More
1 year 3 weeks ago #159901 by miguelvillegas88
miguelvillegas88 replied the topic: Array Question with "Other" Answer
HI, Im sorry can you help me, i want to put de other´s textbox in a X Axis, like the image

this is the script


thanks

<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 question
$(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;
$('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 input
$('.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 input(s) 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>
Attachments:

Please Log in or Create an account to join the conversation.

More
4 months 4 weeks ago - 4 months 4 weeks ago #169994 by DVP17lemon
DVP17lemon replied the topic: Array Question with "Other" Answer
Thanks @tpartner for this great code!

However, I only wanted to ask if there is also a way to accomplish this without using JavaScript? @DenisChenu has posted something that seems to go into this direction. Unfortunately, it is not fully clear how his example actually works. Does anybody have a detailed explanation of @DenisChenu's post or how to accomplish this without using JavaScript?
Last Edit: 4 months 4 weeks ago by DVP17lemon.

Please Log in or Create an account to join the conversation.

More
4 months 4 weeks ago #170003 by DenisChenu
DenisChenu replied the topic: Array Question with "Other" Answer
I never put any code about a solution to integrate "other free text" in the array .

Just the simple Expression Manager system to fill sub questions with another question : master.sondages.pro/919152

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in or Create an account to join the conversation.

More
4 months 4 weeks ago #170019 by tpartner
tpartner replied the topic: Array Question with "Other" Answer
Well, still with JavaScript, but this may be a better solution - the "Other" or "Comments" fields are in modal (pop up) dialogs.

www.limesurvey.org/forum/can-i-do-this-w...elds?start=15#168906

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

Please Log in or Create an account to join the conversation.

More
2 weeks 1 day ago #176233 by rizkiheryandi
rizkiheryandi replied the topic: Array Question with "Other" Answer
Wow, big effort for answering with javascript solution everywhere, i appreciate and you all amazing guys

But im scare about the result of the input, would it be a big trouble when we collect the data and export for analysing it ?

Because we add more our own input field and not from the official system

Im new with LS, but in my logic it can be happen, but maybe it's not a problem when you create javascript and you know what are you doing

Thanks !!

(Answering the "4 years ago of thread" maybe my answer it's invalid)

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!