Combine several questions types into one grid, using newest template

Plus d'informations
il y a 1 mois 6 jours - il y a 1 mois 6 jours #188754 par Joffm
Tony's script and his sample survey work in 3.17.x

You only have to adapt the css.

A very raw review.


Joffm


But in my opinion it's not the best way.

Maybe better to start is this script - also from 2.50 - which inserts uttons in the second column of an array(text)
You may adapt to your needs.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){	
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
 
		// Assign column-specific classes
		$('table.subquestion-list tr', thisQuestion).each(function(i) {
 
			$('> *:gt(0)', this).each(function(i){
				$(this).addClass('column-'+(i+1));
				$(this).attr('data-column', i+1);
			});
		});
 
 
 
		// Hide the text inputs in columns 2
		$('.column-2 input[type="text"]', thisQuestion).hide();
 
		// Loop through all column-2 inputs
		$('.answer-item.column-2 input[type="text"]', thisQuestion).each(function(i) {
			var thisID = $(this).attr('id');
			var thisValue = $(this).val();
 
			// Insert the radios
			$(this).parent().addClass('radio').append('<span class="inserted-radio-wrapper">\
										<input id="'+thisID+'-Y" class="radio" value="Y" name="'+thisID.replace(/answer/, '')+'_radio" type="radio">\
										<label class="control-label radio-label" for="'+thisID+'-Y">Yes</label>\
									</span>\
									<span class="inserted-radio-wrapper">\
										<input id="'+thisID+'-N" class="radio" value="N" name="'+thisID.replace(/answer/, '')+'_radio" type="radio">\
										<label class="control-label radio-label" for="'+thisID+'-N">No</label>\
									</span>');
 
			// Initial radio states
			$(this).closest('td').find('input[type="radio"][value="'+thisValue+'"]').prop('checked', true);
		});
 
		// Listener on the radios
		$('.answer-item.column-2 input[type="radio"]', thisQuestion).on('click', function() {
			var thisInput = $(this).closest('td').find('input[type="text"]');
			$(this).closest('td').find('input[type="text"]').val($(this).val());
			checkconditions($(thisInput).val(), $(thisInput).attr('name'), 'text');
		});
 
		// Some clean-up styles for the radios (could be placed in template.css)
		$('thead th, .answer-item.column-2', thisQuestion).css({
			'text-align': 'center'
		});
		$('.answer-item.column-2 .inserted-radio-wrapper', thisQuestion).css({
			'display': 'inline-block',
			'margin': '0px 0px 0 0px',
            'padding-left':'20px'
		});
		$('.answer-item.column-2 label', thisQuestion).css({
			'padding': '0'
		});
		$('.answer-item.column-2 .radio-label', thisQuestion).css({
			'padding-left': '3px',
			'margin-right': '3px',
            'padding':'0px 0px 0px 3px',
          'margin-left':'10px'
		});
 
 
		// Fix up the row background colours
		var rowIndex = 0;
		$('table.subquestion-list tbody tr', thisQuestion).each(function(i){
			rowIndex ++;
			$(this).removeClass('array1, array2');
			if(rowIndex % 2 == 0) {
				$(this).addClass('array1');
			}
			else {
				$(this).addClass('array2');
			}
		});
	});
</script>



Volunteers are not paid.
Not because they are worthless, but because they are priceless
Pièces jointes :
Dernière édition: il y a 1 mois 6 jours par Joffm.
Les utilisateur(s) suivant ont remercié: DenisChenu

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 1 mois 17 heures #188888 par GISS
Thank you again.
Now I have the problem that wenn I export the answers to SPSS I get only string-variables.
I need numeric-variables. What can I do?

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 1 mois 15 heures - il y a 1 mois 14 heures #188904 par Joffm
Well, that's obvious.
You use an array(text).

But this you handle in SPSS.
Like:
RECODE VAR00001 ('Y'='1') ('N'='2').
EXECUTE.

And then change to numeric.

Or you may change the value of the radio buttons:
<input id="'+thisID+'-Y" class="radio" value="Y" name="'+thisID.replace(/answer/, '')+'_radio" type="radio">
from "Y" to "1", resp. "N" to "2".

And before you run the syntax file of SPSS change the data type of these variables from "(A)" to blank.


Joffm


Volunteers are not paid.
Not because they are worthless, but because they are priceless
Dernière édition: il y a 1 mois 14 heures par Joffm. Raison: Addition

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 2 semaines 4 jours - il y a 2 semaines 4 jours #189316 par asilbering
Hi Joffm (or anybody else who can give me a hand),


I am using LimeSurvey 2.05+ and I am trying to combine two question types (Short text and dropdown) to create something like the image attached. I have used the old workaround described in the manual as mentioned at the beginning of the thread ( manual.limesurvey.org/Workarounds:_Quest...stion_types_in_array ).
The problem is that it is not clear to me how to add the question text in that configuration.
If I add a text display question before then the text is not in the same box as the answers. I am very new to Limesurvey, and I don't have the full admin rights, so I cannot install the plugin mentioned above. And as far Java is concerned, I just copy pasted the bits of code I needed, I am not able to develop things on my own yet...

I really liked the option you proposed in your last post, which is a lot more elegant than the one I am using. Is there a way to make that work on Limesurvey 2.05+?

Thanks a lot in advance!
Best regards,

Ana

PS: actually I am also having trouble with the implementation of the "old fashioned" approach. The first image I posted was in a Demo survey, but when I copied the questions to my survey, nothing works (see second screenshot). Any ideas? Thanks a lot!!
Pièces jointes :
Dernière édition: il y a 2 semaines 4 jours par asilbering. Raison: add a second question to the post.

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 2 semaines 3 jours #189369 par tpartner
I'm not clear on what you need. You refer to Joffm's last post which shows how to insert radio buttons into a text-array but your screenshot indicates that you want drop-downs in the second column. Which is it?

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 2 semaines 3 jours #189370 par asilbering
You are right, sorry. I got mixed up with a previous post showing how to introduce dropdown menus, which is what I need.

Thanks!
Ana

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 2 semaines 3 jours - il y a 2 semaines 3 jours #189379 par tpartner
This script should insert drop-downs in the last column of an array-texts in version 2.05 and 2.06LTS:

<script type="text/javascript" charset="utf-8">
 
	$(document).ready(function() {
		var thisQuestion = $('#question{QID}');
 
		// Insert selects into last column
		$('.answer-item:last-child', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
													<option value="">Please choose...</option>\
													<option value="1">Option 1</option>\
													<option value="2">Option 2</option>\
													<option value="2">Option 3</option>\
													<option value="2">Option 4</option>\
												</select>'); 
 
		// Listeners
		$('.inserted-select', thisQuestion).on('change', function(i) {
			var thistextInput = $(this).closest('.answer-item').find('input:text');
			if($(this).val() != '') {
				$(thistextInput).val($.trim($('option:selected', this).text())).trigger('change');
			}
			else {
				$(this).closest('.answer-item').find('input:text').val('').trigger('change');
			}
			checkconditions($(thistextInput).attr('value'), $(thistextInput).attr('name'), $(thistextInput).attr('type'));
		});
 
		// Returning to page
		$('.with-select input:text', thisQuestion).each(function(i) {
			var thisCell = $(this).closest('.answer-item');
			var inputText = $.trim($(this).val());
			var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
			$('select.inserted-select', thisCell).val(selectval);
		});
 
		// Clean-up styles
		$('select.inserted-select', thisQuestion).css({
			'max-width': '100%'
		});
		$('.with-select input:text', thisQuestion).css({
			'position': 'absolute',
			'left': '-9999em'
		});
	});
</script>



Sample survey attached:

Fichier attaché :

Nom du fichier : limesurvey...2821.lss
Taille du ficher :17 ko

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Pièces jointes :
Dernière édition: il y a 2 semaines 3 jours par tpartner.

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 2 semaines 2 jours #189410 par asilbering
This is excellent tpartner!
Thank you so much!!

Ana

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 1 semaine 2 jours #189690 par asilbering
Good morning,

I would like to change the above script to have the dropdowns on the first column and text boxes in the last one.
I tried modifying the script as follows:
'.answer-item:last-child' --> '.answer-item:first-child'
and also
'.answer-item:last-child' --> '.answer-item.answer_cell_X001'
but neither worked.

If this is not too complicated, could you please give me a hint on how to proceed?

Also, is there a list somewhere with the codes used to access the different parts of the answer so I can learn to do this by myself? I am new to java scripting but would really like to learn...

Thanks a lot in advance!
Have a nice day,
Ana

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 1 semaine 2 jours - il y a 1 semaine 2 jours #189693 par tpartner
You need to use :nth-child(2) in the selector as the table cells in the first answer column are actually the second child in each row (the sub-question text is in the first child).

- api.jquery.com/nth-child-selector/

<script type="text/javascript" charset="utf-8">
 
	$(document).ready(function() {
		var thisQuestion = $('#question{QID}');
 
		// Insert selects into last column
		$('.answer-item:nth-child(2)', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
													<option value="">Please choose...</option>\
													<option value="1">Option 1</option>\
													<option value="2">Option 2</option>\
													<option value="2">Option 3</option>\
													<option value="2">Option 4</option>\
												</select>'); 
 
		// Listeners
		$('.inserted-select', thisQuestion).on('change', function(i) {
			var thistextInput = $(this).closest('.answer-item').find('input:text');
			if($(this).val() != '') {
				$(thistextInput).val($.trim($('option:selected', this).text())).trigger('change');
			}
			else {
				$(this).closest('.answer-item').find('input:text').val('').trigger('change');
			}
			checkconditions($(thistextInput).attr('value'), $(thistextInput).attr('name'), $(thistextInput).attr('type'));
		});
 
		// Returning to page
		$('.with-select input:text', thisQuestion).each(function(i) {
			var thisCell = $(this).closest('.answer-item');
			var inputText = $.trim($(this).val());
			var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
			$('select.inserted-select', thisCell).val(selectval);
		});
 
		// Clean-up styles
		$('select.inserted-select', thisQuestion).css({
			'max-width': '100%'
		});
		$('.with-select input:text', thisQuestion).css({
			'position': 'absolute',
			'left': '-9999em'
		});
	});
</script>

Sample survey attached:

Fichier attaché :

Nom du fichier : limesurvey...2282.lss
Taille du ficher :17 ko

Also, is there a list somewhere with the codes used to access the different parts of the answer so I can learn to do this by myself? I am new to java scripting but would really like to learn...

You can use browser developer tools (F12) to explore the HTML elements.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Pièces jointes :
Dernière édition: il y a 1 semaine 2 jours par tpartner.

Connexion ou Créer un compte pour participer à la conversation.

Plus d'informations
il y a 1 semaine 2 jours #189695 par asilbering
Thanks Tony!

Have a nice day,
Ana

Connexion ou Créer un compte pour participer à la conversation.

Commencez dès maintenant !

Créez simplement un compte et commencez à utiliser LimeSurvey dès aujourd'hui.

Inscrivez-vous maintenant

Inscrivez-vous à notre Newsletter!