Array with radio buttons and text on the same line

Más
4 años 8 meses antes #116879 por eloner
Hello to everybody.
I am using LS 2.05+ Build 141229.
I am planning to create a question like this:



The logic of the question is:
1. To have on the same line the radio buttons + the text (on the right of each button)
2. Repeat the radio buttons + the text for every sub-question
3. Column width is the same for column 2 and 4 (tight) and for 3 and 5 (wide)

The logic of the experiment is to check for the effect of text close to radio buttons and of distance between columns.
I think I should use javascript code, but it isn't easy for me!

Any suggestion or idea would be greatly appreciated!
Cheers,
elo
Adjuntos:

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

LimeSurvey Partners
Más
4 años 8 meses antes #116932 por tpartner
This is untested but maybe a script like this in the source of the array:

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function() {
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
 
		thisQuestion.addClass('modified-array');
 
		$('td.answer-item', thisQuestion).each(function(i) {
			$(this).append($('label', this));
		});
    });	
</script>

And, then something like this in template.css:

.modified-array .subquestions-list col {
	width: auto !important;
}
 
.modified-array .subquestions-list thead {
	display: none;
}
 
.modified-array td.answer-item {
	text-align: left !important;
	vertical-align: top !important;
}
 
.modified-array label.hide {
	position: relative;
	left: auto;
	top: auto;
}
 
.modified-array input.radio {
	margin-right: 5px;
}
 
.modified-array .answertext {
	width: 20%;
}
 
.modified-array .answer-column-1,
.modified-array .answer-column-3 {
	width: 10%;
}
 
.modified-array .answer-column-2,
.modified-array .answer-column-4 {
	width: 30%;
}

Cheers,
Tony Partner

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

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116963 por eloner
Thank you Tony.
I tried to change my survey as suggested, but apparently the question was not effected.

I enclose the survey file

Archivo Adjunto:

Nombre del Archivo: limesurvey...9139.lss
Tamaño del Archivo:16 KB


And the template.css file with the new lines added at the end:


Maybe am I doing something wrong?

Thank you for your help and patience!
Cheers,
Enzo
Adjuntos:

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116965 por DenisChenu

tpartner escribió: This is untested but maybe a script like this in the source of the array:

No need to add lable.

In the last version, label are in each td, but with .hide class.

Denis

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

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116970 por tpartner
@Denis, I know, I didn't add the label, I simply moved it within the table cell. As you can see I accessed the .hide class.


@eloner, Please activate a test survey so we can see the source.

Cheers,
Tony Partner

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

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116971 por DenisChenu

tpartner escribió: @Denis, I know, I didn't add the label, I simply moved it within the table cell. As you can see I accessed the .hide class.

You're rigth, i don't use $('label',$this)) a lot ... maybe i must more.

gitorious.org/skeletonquest/skeletonques...82f:template.js#L391 :blush:

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
An error happen ? Before make a new topic : remind the Debug mode .
El siguiente usuario dijo gracias: eloner

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116973 por eloner
Dear all,
here you can text the survey:
srssurvey.unitn.it/limesurvey/index.php/899139/lang-en
Cheers,
Enzo

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116974 por tpartner
You have made an error pasting in the script:


Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Adjuntos:
El siguiente usuario dijo gracias: eloner

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes - 4 años 8 meses antes #116980 por eloner
Ops... sorry for my thoughtlessness! :S
Initially I pasted correctly all the text...
The problem is that the system seems to override the rules (in template.css) for the column.
I see the label on the right of the radio button, but the width is not as I wanted.
I tyed to play with the parameters of in template.css (i.e. changing the values for the width) or with sub-question width in the advanced options of the array, but the spaces between the column don't change so much.



Maybe is it possible to add a (non clickabel) column between column 2 and colomn 3?

Cheers and thank you for your precious suggestions!
Adjuntos:
Última Edición: 4 años 8 meses antes por eloner. Razón: grammatics!

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116982 por tpartner
Oops, now it's my turn to be embarrassed, I forgot to assign the column classes. Use this script:

<script type="text/javascript" charset="utf-8">	
	$(document).ready(function() {
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
 
		thisQuestion.addClass('modified-array');
 
		// Assign column-specific classes
		$('.answers-list', thisQuestion).each(function(i){
			$('td.answer-item', this).each(function(i){
				$(this).addClass('answer-column-'+(i+1)+'');
			});
		});
 
		$('td.answer-item', thisQuestion).each(function(i) {
			$(this).append($('label', this));
		});
    });
</script>

Cheers,
Tony Partner

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

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

Más
4 años 8 meses antes #116983 por eloner
Perfect!
Now it works!
Thank you!!!!!!!!!!!!!!!!
Cheers
elo

Por favor, Identificarse o Crear cuenta para unirse a la conversación.

¡Comenzar ahora!

Simplemente cree una cuenta y comience a usar LimeSurvey hoy mismo.

Registrarse ahora
¡Únase a nuestro boletín informativo!

Iniciar sesión