Welcome, Guest
Username: Password: Remember me

TOPIC: Dual Scale Array to Multiple Scale Array Possibility?

Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76629

  • Newbeedu
  • Newbeedu's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 26
  • Karma: 0
Hello there,

I have a question where 10 items are to be rated on 3 - 4 parameters on a scale of 1 to 5 in one question.

The requirement looks like this.

Can we create this on LimeSurvey?

Thanks,
ArrayRequirement.jpg
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76644

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4186
  • Thank you received: 786
  • Karma: 359
You can use 4 array questions. CSS (and maybe a little JavaScript) can then be used to align them side by side and hide the row labels for questions 2, 3 and 4.

The CSS details would depend on the template you are using.

If you can attach a sample survey with the 4 questions and your template (or tell us which template you prefer), I can give some CSS tips.
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76682

  • DenisChenu
  • DenisChenu's Avatar
  • OFFLINE
  • Moderator Lime
  • Posts: 6318
  • Thank you received: 812
  • Karma: 242
And without CSS/javascript but with little modification : select/option 1 to 5 for notation.

Use array / number : min value : 1 / Max value : 1 ( step: 1).

Remark: the array take a long place : use selectbox or use 4 array can be more simple and more effective for user.

Denis
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76736

  • Newbeedu
  • Newbeedu's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 26
  • Karma: 0
Hi,

I have put in check box as sample but i need radio buttons as the parameters will be rated on a scale of 5 and only one rate for each parameter need to be selected.

I am using default template an i am fine with any template.

Please help.

Thanks,
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76738

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4186
  • Thank you received: 786
  • Karma: 359
Sure, but please attach a sample survey with the 4 questions so we don't have to spend time creating them.
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76742

  • Newbeedu
  • Newbeedu's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 26
  • Karma: 0
As I have 2 different questions one with 3 and another with 4 options, i have put up 3 questions in this survey.
Attachments:
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 6 months ago #76778

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4186
  • Thank you received: 786
  • Karma: 359
Since you need to do this with several questions, I have opted for a JavaScript approach instead of CSS. It can be used in any group with the following conditions/caveates:
- The survey is in group by group mode
- There can only be array questions or text display questions in the group
- All Arrays will be aligned side-by side

1) Set up your survey to use JavaScript.

2) Add the following script to the source of one of the questions in a group.

The script wraps all questions that are not text-displays in a div element and aligns them side-by-side. There are some styles applied to the questions - these are for the default template but can be modified for other templates.
<script type="text/javascript" charset="utf-8">
 
	$(document).ready(function() {
		// Loop through all questions (except boilerplates) and add some classes
		$('div[id^="question"]').each(function(i){
			if (!$(this).hasClass('boilerplate')) {
				$(this).addClass('inlineQuestion');
				if(i < 1) {
					$(this).addClass('inlineQuestionPrime');
				}
				else {
					$(this).addClass('inlineQuestionSub');
				}
			}
		});
 
		// Wrap the questions in a div
		$('.inlineQuestion').wrapAll('<div class="inlineWrapper" />');
 
		// Remove the text from the secondary questions
		$('.inlineQuestionSub th.answertext').text('');
 
		// Apply some styles (these are for the default template)
		$('.inlineQuestion').css({ 'float': 'left' });
		$('.inlineQuestion col, .inlineQuestion th.answertext').css({ 'width': 'auto' });
		$('.inlineQuestion .question-wrapper').css({ 'width': '100%' });
		$('.inlineQuestion td.answer').css({ 'padding': '0.5em 0' });
		$('.inlineQuestion td.questiontext').css({ 'text-align': 'center' });
 
		// Center the wrapper div
		var wrapperWidth = 0;
		$('.inlineQuestion').each(function(i){ 
			wrapperWidth = wrapperWidth + $(this).width();
			var padLeft = $('.answertext:eq(0)', this).width() + 3;
			$('.questiontext', this).css({ 'padding-left':padLeft+'px', 'padding-right':'3px' });
		});
		$('.inlineWrapper').css({ 'width':wrapperWidth+'px', 'margin': '0 auto' });
	});
 
</script>

Here is your sample survey with 2 groups. The script is in the source of the first array in each group.

File Attachment:

File Name: limesurvey_survey_64194.lss
File Size: 82 KB


And the result...
Capture_2012-03-17.JPG
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 5 months ago #76810

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4186
  • Thank you received: 786
  • Karma: 359
Duh...just noticed that the row labels are dropped...

Use this script:
<script type="text/javascript" charset="utf-8">
 
	$(document).ready(function() {
		// Loop through all questions (except boilerplates) and add some classes
		$('div[id^="question"]').each(function(i){
			if (!$(this).hasClass('boilerplate')) {
				$(this).addClass('inlineQuestion inlineQuestionSub');
			}
		});
		$('.inlineQuestionSub:first').removeClass('inlineQuestionSub').addClass('inlineQuestionPrime');
 
		// Wrap the questions in a div
		$('.inlineQuestion').wrapAll('<div class="inlineWrapper" />');
 
		// Remove the text from the secondary questions
		$('.inlineQuestionSub th.answertext').text('');
 
		// Apply some styles (these are for the default template)
		$('.inlineQuestion').css({ 'float': 'left' });
		$('.inlineQuestion col, .inlineQuestion th.answertext').css({ 'width': 'auto' });
		$('.inlineQuestion .question-wrapper').css({ 'width': '100%' });
		$('.inlineQuestion td.answer').css({ 'padding': '0.5em 0' });
		$('.inlineQuestion td.questiontext').css({ 'text-align': 'center' });
 
		// Center the wrapper div
		var wrapperWidth = 0;
		$('.inlineQuestion').each(function(i){ 
			wrapperWidth = wrapperWidth + $(this).width();
			var padLeft = $('.answertext:eq(0)', this).width() + 3;
			$('.questiontext', this).css({ 'padding-left':padLeft+'px', 'padding-right':'3px' });
		});
		$('.inlineWrapper').css({ 'width':wrapperWidth+'px', 'margin': '0 auto' });
	});
 
</script>

And this survey:

File Attachment:

File Name: limesurvey_survey_641941.lss
File Size: 82 KB



Capture_2012-03-18-2.JPG
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.
The following user(s) said Thank You: Newbeedu

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 5 months ago #76837

  • Newbeedu
  • Newbeedu's Avatar
  • OFFLINE
  • Junior Lime
  • Posts: 26
  • Karma: 0
This is Magic! Amazing Tony.

There is a little problem.

The format looks fine in Mozilla FireFox, but in Chrome and Safari there is a little problem. Images below:
Chrome.jpg



Could you please help.

Thanks,
The administrator has disabled public write access.

Re: Dual Scale Array to Multiple Scale Array Possibility? 2 years 5 months ago #76853

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4186
  • Thank you received: 786
  • Karma: 359
Ah, okay, use this:
<script type="text/javascript" charset="utf-8">
 
	$(document).ready(function() {
		// Loop through all questions (except boilerplates) and add some classes
		$('div[id^="question"]').each(function(i){
			if (!$(this).hasClass('boilerplate')) {
				$(this).addClass('inlineQuestion inlineQuestionSub');
			}
		});
		$('.inlineQuestionSub:first').removeClass('inlineQuestionSub').addClass('inlineQuestionPrime');
 
		// Wrap the questions in a div
		$('.inlineQuestion').wrapAll('<div class="inlineWrapper" />');
 
		// Remove the text from the secondary questions
		$('.inlineQuestionSub th.answertext').text('');
 
		// Apply some styles (these are for the default template)
		$('.inlineQuestion').css({ 'float': 'left' });
		$('.inlineQuestion col, .inlineQuestion th.answertext').css({ 'width': 'auto' });
		$('.inlineQuestion .question-wrapper').css({ 'width': '100%' });
		$('.inlineQuestion td.answer').css({ 'padding': '0.5em 0' });
		$('.inlineQuestion td.questiontext').css({ 'text-align': 'center' });
 
		// Center the wrapper div
		var wrapperWidth = 0;
		$('.inlineQuestion').each(function(i){ 
			wrapperWidth = wrapperWidth + $(this).width();
			var padLeft = $('.answertext:eq(0)', this).width() + 3;
			$('.questiontext', this).css({ 'padding-left':padLeft+'px', 'padding-right':'3px' });
		});
		$('.inlineWrapper').css({ 'width':wrapperWidth+'px', 'margin': '0 auto' });
 
		// Set the row heights
		var wrapperWidth = 0;
		$('.inlineQuestionSub').each(function(i){
			$('tbody[id^="javatbd"]', this).each(function(i){ 
				var ansHeight = $('.inlineQuestionPrime th.answertext:eq('+i+')').innerHeight();
				//$('th.answertext', this).css({ 'height':ansHeight+'px' });
 
				if($.browser.mozilla) {
					$('th.answertext', this).height(ansHeight);
				}
				else {
					$('th.answertext', this).innerHeight(ansHeight);
				}
			});
		});
	});
 
</script>


File Attachment:

File Name: limesurvey_survey_641942.lss
File Size: 83 KB
Cheers,
Tony Partner

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

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.
The following user(s) said Thank You: Newbeedu
Moderators: ITEd
Time to create page: 0.152 seconds
Donation Image