Combine multiple-short-text and dropdown

More
3 years 3 months ago #120545 by Jules
Jules created the topic: Combine multiple-short-text and dropdown
Hi all,

I would like to create a question consisting of a multiple-short-text followed by a dropdown just like in this example https://www.limesurvey.org/en/forum/design-issues/95342-changing-a-column-of-an-array-number-type-question-to-text-input#102550 , but simpler.

I tried to modify the survey attached to the above thread but cannot get it to work. I changed the code in the following way but now the text fields do not appear anymore. Also, in my case I would like the text fields to be in the first column and the dropdowns to be in the second. Do I just put “before” instead of “after” when trying to add a column to the array?
arrayNumbers: <script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function(){
 
		// Identify the questions
		var thisQuestion = $('#question{QID}');
		var nextMultiText1 = $(thisQuestion).nextAll('.multiple-short-txt:eq(0)');
 
 
		// Hide the next questions 
		$(nextMultiText1).hide();
 
		// Add extra columns to the array
		$('table.question thead tr th:eq(1)', thisQuestion).after('<th class="newColumn1" />');
		$('table.question tbody tr', thisQuestion).each(function(i) {
			$('td:eq(1)', this).after('<td class="newColumn1" />');
		});
 
		// Move the hidden question text to the inserted columns
		$('table.question thead tr th.newColumn1', thisQuestion).text($('.questiontext', nextMultiText1).text());
 
		// Move the text inputs and dropdowns
		$('input.text', nextMultiText1).each(function(i){
			$('table.question tbody tr:eq('+i+') td.newColumn1', thisQuestion).append(this);
		});
 
		// Some cleanup styles (for the default template)
		$('col', thisQuestion).css({
			'width': 'auto'
		});
		$('table.question tbody th, table.question tbody td', thisQuestion).css({
			'padding': '4px 10px'
		});
 
	});
</script>

I would highly appreciate any help!
Cheers
J

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

More
3 years 3 months ago - 3 years 3 months ago #120555 by tpartner
tpartner replied the topic: Combine multiple-short-text and dropdown
Try this:

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function(){
 
		// Identify the questions
		var thisQuestion = $('#question{QID}');
		var nextMultiText1 = $(thisQuestion).nextAll('.multiple-short-txt:eq(0)');
 
		// Hide the next questions 
		$(nextMultiText1).hide();
 
		// Add a column to the array (before answer column 1)
		$('table.question thead tr th:eq(0)', thisQuestion).before('<th class="newColumn1" />');
		$('table.question tbody tr', thisQuestion).each(function(i) {
			$('td:eq(0)', this).before('<td class="newColumn1" />');
		});
 
		// Move the hidden question text to the inserted column
		$('table.question thead tr th.newColumn1', thisQuestion).text($('.questiontext', nextMultiText1).text());
 
		// Move the text inputs
		$('input.text', nextMultiText1).each(function(i){
			$('table.question tbody tr:eq('+i+') td.newColumn1', thisQuestion).append(this);
		});
 
		// Some cleanup styles (for the default template)
		$('col', thisQuestion).css({
			'width': 'auto'
		});
		$('table.question tbody th, table.question tbody td', thisQuestion).css({
			'padding': '4px 10px'
		});
 
	});
</script>

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

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!