Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1
  • 2

TOPIC: Can I have sliders in a Matrix question?

Can I have sliders in a Matrix question? 2 years 9 months ago #69475

  • Ralle
  • Ralle's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 10
  • Karma: 0
Hi there,

Can you tell me if it is possible to have a dual matrix question using sliders to input numerical values?

Thank you already!
Ralle
The administrator has disabled public write access.

Re: Can I have sliders in a Matrix question? 2 years 9 months ago #69480

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4139
  • Thank you received: 767
  • Karma: 349
The slider is only available "out-of-the-box" in the Multiple Numerical question type.

In an array-dual-scale-dropdown, you can use custom JavaScript to:
- hide the dropdowns
- insert a slider in each array cell
- select the hidden dropdown value based on the slider value

1) Set up your survey to use JavaScript.

2) Create your array-dual-scale-dropdown question with the numerics you require as answer options for each scale.

3) Add the following script to the source of the array. Replace "QQ" with the array question ID.
<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
 
		insertSlider (QQ);
 
		function insertSlider (qID) {
 
			$('#question'+qID+' select').each(function(i, el){
 
				// Hide the dropdown
				 $(el).hide();
 
				var id = $(el).attr('id').replace(/#/g,'-');
 
				// Some dropdown values
				var currentVal = Number($('option:selected', el).val());
				var firstVal = Number($('option[value!=""]:first', el).val());
				var secondVal = Number($('option[value!=""]:first', el).next('option').val());
				var lastVal = Number($('option:last', el).val());
 
				// Insert a a container for the slider
				var container = $('<div class="customSliderWrapper"></div>').insertAfter(el);
 
				// Insert a callout
				var callout = $('<div id="callOut-'+id+'" class="customCallout"></div>').appendTo(container).text($('option:selected', el).val());
 
				// Initiate the slider
				var slider = $('<div id="slider-'+id+'" class="customSlider"></div>').appendTo(container).slider({
					min: firstVal,
					max: lastVal,
					range: 'min',
					value: currentVal,
					step: secondVal - firstVal,
					slide: function( event, ui ) {
						$('option[value="'+ui.value+'"]', el).attr('selected', 'selected');
						//$('#callOut-'+id).text($('option:selected', el).val()).css({'left': $('#slider-'+id+' .ui-slider-handle').css('left')});
 
						function updateCustomCallout() {
							$('#callOut-'+id).text($('option:selected', el).val()).css({'left': $('#slider-'+id+' .ui-slider-handle').css('left')});
						}
						// Delay updating the callout because it was picking up the last postion of the slider
						setTimeout(updateCustomCallout, 10);
					}
				});
 
				// Change the slider if the dropdown is changed
				// (not required if dropdown is hidden)
				$(el).change(function() {
					slider.slider('value', Number($('option:selected', el).val()));
					$('#callOut-'+id).text($('option:selected', el).val());
				});
 
				// Set a value as soon as the slider handle is clicked
				$('#slider-'+id+' .ui-slider-handle').mousedown(function() {
					$('option[value="'+slider.slider('value')+'"]', el).attr('selected', 'selected');
					$('#callOut-'+id).text(slider.slider('value'));
				});
			});
		}
 
	});
</script>

4) Add the following styles to template.css (these are for the default template and may need to be tweaked for others):
.customCallout {
	position: relative;
	width: 50px;
	text-align: left;
	height: 1.75em; 
	font-weight: bold;
	margin-left: -0.3em;
}
 
.customSliderWrapper {
	position: relative;
	margin: 0 10px;
}

Capture_2011-11-19.PNG
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.
Last Edit: 2 years 9 months ago by tpartner.
The administrator has disabled public write access.
The following user(s) said Thank You: Ralle, tomscher

Re: Can I have sliders in a Matrix question? 2 years 9 months ago #69490

  • Ralle
  • Ralle's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 10
  • Karma: 0
Wow, that's great!
Thank you very, very much for supplying copy&paste-ready code solving exactly what I was asking. Awesome job!
The administrator has disabled public write access.

Re: Can I have sliders in a Matrix question? 2 years 9 months ago #69492

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5324
  • Thank you received: 294
  • Karma: 249
Really cool solution! You know where to place it :-)

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.

Re: Can I have sliders in a Matrix question? 2 years 9 months ago #69581

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4139
  • Thank you received: 767
  • Karma: 349
I added this solution to the workarounds section - docs.limesurvey.org/Workarounds%3A+Quest...y-Dual-Scale-Numbers
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: Can I have sliders in a Matrix question? 2 years 7 months ago #72086

  • yuniper
  • yuniper's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 4
  • Karma: 0
Hi guys,

I am completely new to Limesurvey but am very intersted in the options explained above. I have tried to replicate this and succeeded in getting 2 slide scales next to eachother but I cannot move to a specific value. Instead when I click on the scale the value 1 appears above it (see picture). I am thinking I may have done something wrong when specifying the answer options?

Also in my case I would actually like the first scale to be "regular" tick the option that is applicable style and the second scale to look like a slider scale in the range of 0-100. To be more specific, I only want the respondent to fill out the slider scale question if they answered "yes" to the first question...

Any tips are highly appreciated :)
Attachments:
Last Edit: 2 years 7 months ago by yuniper.
The administrator has disabled public write access.

Re: Can I have sliders in a Matrix question? 2 years 7 months ago #72095

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4139
  • Thank you received: 767
  • Karma: 349
yuniper. can you attach a sample survey with your code in it?
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: Can I have sliders in a Matrix question? 2 years 7 months ago #72115

  • yuniper
  • yuniper's Avatar
  • OFFLINE
  • Fresh Lemon
  • Posts: 4
  • Karma: 0
Hi tpartner

I think I can if you give me more specific instructions ;)
The administrator has disabled public write access.

Re: Can I have sliders in a Matrix question? 2 years 7 months ago #72125

  • tpartner
  • tpartner's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 4139
  • Thank you received: 767
  • Karma: 349
Create a small sample survey with your question(s) and JavaScript code in place.

Export the survey as a LimeSurvey XML survey file (*.lss).
Capture_2012-01-17.PNG


Then attach it here.
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: Can I have sliders in a Matrix question? 2 years 7 months ago #72126

  • Mazi
  • Mazi's Avatar
  • OFFLINE
  • LimeSurvey Team
  • Posts: 5324
  • Thank you received: 294
  • Karma: 249
yuniper wrote:
Hi tpartner

I think I can if you give me more specific instructions ;)
???

Best regards/Beste Grüße,
Dr. Marcel Minke
(Limesurvey Head of Support)
Need Help? We offer professional Limesurvey support
Contact: marcel.minke(at)limesurvey.org'"
The administrator has disabled public write access.
  • Page:
  • 1
  • 2
Moderators: ITEd
Time to create page: 0.154 seconds
Donation Image