Check out the LimeSurvey source code on GitHub!
Welcome, Guest
Username: Password:

TOPIC: Multiple types in array - rank all then choose some items

Multiple types in array - rank all then choose some items 2 years 2 months ago #110594

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6321
  • Thank you received: 1407
  • Karma: 547
Hi Elisa,

Try this:

<script type="text/javascript" charset="utf-8">	
 
	$(document).ready(function(){
 
		// The error messages
		var error1 = 'You can only select 5 attributes.';
		var error2 = 'Please select 5 attributes.';
 
		// Identify the questions
		var thisQuestion = $('#question{QID}');
		var nextMultiOpt = $(thisQuestion).nextAll('.multiple-opt:eq(0)');
 
		// Add a class to the array question (for styling) 
		$(thisQuestion).addClass('array-plus-checkboxes');
 
		// Hide the next question 
		$(nextMultiOpt).hide();
 
		// Add an extra column to the array
		$('table.question thead tr', thisQuestion).append('<th class="newColumn1" />');
		$('table.question tbody tr', thisQuestion).each(function(i) {
			$(this).append('<td class="newColumn1" />');
		});
 
		// Move the hidden question text to the inserted column
		$('table.question thead tr th.newColumn1', thisQuestion).text($('.questiontext', nextMultiOpt).text());
 
		// Move the checkboxes into the array
		$('input.checkbox', nextMultiOpt).each(function(i){
			$('table.question tbody tr:eq('+i+') td.newColumn1', thisQuestion).append(this);
		});
 
		// Listener on the checkboxes (to test for maximum 5 checked boxes)
		$('input.checkbox', thisQuestion).click(function(event) {
			if($('input.checkbox:checked', thisQuestion).length > 5) {
				alert(error1);
				$(this).attr('checked', false);
			}
			if($('input.checkbox:checked', thisQuestion).length == 5) {
				$('th.newColumn1', thisQuestion).removeClass('mandatory-error');
			}
		});
 
		// Interrupt the Next/Submit function (to test for minimum 5 checked boxes)
		$('#movenextbtn, #movesubmitbtn').bind('click', function () {
 
			$('th.newColumn1', thisQuestion).removeClass('mandatory-error');
 
			if($('input.checkbox:checked', thisQuestion).length < 5) {
				$('th.newColumn1', thisQuestion).addClass('mandatory-error');
				alert(error2);
				return false;
			}
		});
 
		// Some cleanup styles
		$('col', thisQuestion).css({
			'width': 'auto'
		});
 
	});
</script>
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The administrator has disabled public write access.
The following user(s) said Thank You: elisa

Multiple types in array - rank all then choose some items 2 years 2 months ago #110690

  • elisa
  • elisa's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 76
  • Thank you received: 23
  • Karma: 9
Thanks a lot Tony. It works perfecty.
Cheers,
Elisa
Elzbieta Lesinska
LS Polish translator and supervisor
The administrator has disabled public write access.

Multiple types in array - rank all then choose some items 4 weeks 3 hours ago #141232

  • elisa
  • elisa's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 76
  • Thank you received: 23
  • Karma: 9
I'm digging up this topic because I need to adapt the given workaround to LS 2.5. The script was created for LS 2.0 and worked perfectly. I copied it to the survey in LS 2.5 and added some code to the default template (the code given by Tony at the top) but this doesn't look good. The script itself seems to work very well but the styles do not. When I insert the exact code given by Tony to the question I cannot control the subquestion column width. When I delete this part of the code:
// Some cleanup styles
		$('col', thisQuestion).css({
			'width': 'auto'
		});
I can control the subquestion width but the answer columns have different width and the last column (the second question) is too thin.

I'll be very grateful for help with adapting this workaround for LS 2.5.
Regards

With the "auto width" command:


After deleting the "auto width" command:
Elzbieta Lesinska
LS Polish translator and supervisor
The administrator has disabled public write access.

Multiple types in array - rank all then choose some items 4 weeks 2 hours ago #141242

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 6321
  • Thank you received: 1407
  • Karma: 547
In LimeSurvey 2.5, add this script to the array question source:
<script type="text/javascript" charset="utf-8">		
	$(document).ready(function(){
 
		// The error messages
		var error1 = 'You can only select 5 attributes.';
		var error2 = 'Please select 5 attributes.';
 
		// Identify some elements
		var thisQuestion = $('#question{QID}');
		var nextMultiOpt = $(thisQuestion).nextAll('.multiple-opt:eq(0)');
		var thisTable = $('table.subquestion-list', thisQuestion);
		var answerCols = $('col:not(.col-answers)', thisTable);
 
		// Find intitial answer column widths
		var colWidth = ($(answerCols[0]).width()/$(thisTable).width())*100;
		var colWidthTotal = answerCols.length*colWidth;
 
		// Add a class to the array question (for styling) 
		$(thisQuestion).addClass('array-plus-checkboxes');
 
		// Hide the next question 
		$(nextMultiOpt).hide();
 
		// Add an extra column to the array
		$('colgroup', thisTable).append('<col class="inserted-col" />');
		$('thead tr', thisTable).append('<th class="newColumn1" />');
		$('tr.answers-list', thisTable).append('<td class="newColumn1" />');
 
		// Move the hidden question text to the inserted column
		$('thead tr th.newColumn1', thisTable).text($('.questiontext', nextMultiOpt).text());
 
		// Move the checkboxes into the array
		$('input.checkbox', nextMultiOpt).each(function(i){
			$('tbody tr:eq('+i+') td.newColumn1', thisTable).append(this);
		});
 
		// Reset the answer column widths
		$('col:not(.col-answers)', thisTable).css({
			'width': (colWidthTotal/$('col:not(.col-answers)', thisTable).length)+'%'
		});
 
		// Remove responsive classes
		$(thisTable).closest('.no-more-tables').removeClass('no-more-tables no-more-tables-array-no-dropdown');
		$('td.answer-item .visible-xs-block', thisTable).remove();
 
		// Listener on the checkboxes (to test for maximum 5 checked boxes)
		$('input.checkbox', thisTable).click(function(event) {
			if($('input.checkbox:checked', thisTable).length > 5) {
				alert(error1);
				$(this).attr('checked', false);
			}
			if($('input.checkbox:checked', thisTable).length == 5) {
				$('th.newColumn1', thisTable).removeClass('mandatory-error');
			}
		});
 
		// Interrupt the Next/Submit function (to test for minimum 5 checked boxes)
		$('#movenextbtn, #movesubmitbtn').bind('click', function () {
 
			$('th.newColumn1', thisTable).removeClass('mandatory-error');
 
			if($('input.checkbox:checked', thisTable).length < 5) {
				$('th.newColumn1', thisTable).addClass('mandatory-error');
				alert(error2);
				return false;
			}
		});
 
	});
</script>

Add this to the end of template.css:
.array-plus-checkboxes .newColumn1 {
	background-color: #C0CEDD;
	text-align: center;
}
 
.array-plus-checkboxes .newColumn1.mandatory-error {
	color: #FF0000;
}



Sample survey attached:

File Attachment:

File Name: limesurvey...38-2.lss
File Size:28 KB
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The administrator has disabled public write access.
The following user(s) said Thank You: elisa

Multiple types in array - rank all then choose some items 3 weeks 6 days ago #141254

  • elisa
  • elisa's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 76
  • Thank you received: 23
  • Karma: 9
Tony,
As usual, this a big job and really great help for me. Thank you.

Cheers
Elzbieta Lesinska
LS Polish translator and supervisor
The administrator has disabled public write access.
Time to create page: 0.229 seconds
Imprint                   Privacy policy         General Terms & Conditions         Revocation information and revocation form