- Posts: 35
- Thank you received: 1
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
2 arrays in the same group using "Multiple question types in array"
- RaCMJS
- Topic Author
- Offline
- Junior Member
Less
More
8 years 10 months ago #119682
by RaCMJS
2 arrays in the same group using "Multiple question types in array" was created by RaCMJS
Is it possible to use 2 arrays in the same group using "Multiple question types in array" (
manual.limesurvey.org/Workarounds:_Quest...ayout_and_templating
)?
I can't get this to work and I can't figure out whether this just cant be done or whether I am not specifying the start position for the second array correctly.
I have 3 "regular" questions, then the array (3 rows (including header) 3 columns) and then another 3 "regular" questions and then the second array (3 rows (including header) 3 columns). Is the position in the second array the actual position - number of question preceding?
Thanks.
I can't get this to work and I can't figure out whether this just cant be done or whether I am not specifying the start position for the second array correctly.
I have 3 "regular" questions, then the array (3 rows (including header) 3 columns) and then another 3 "regular" questions and then the second array (3 rows (including header) 3 columns). Is the position in the second array the actual position - number of question preceding?
Thanks.
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10611
- Thank you received: 3690
8 years 10 months ago #119722
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic 2 arrays in the same group using "Multiple question types in array"
That workaround was not intended to be used with arrays.
I think you'll need to place the 2 groups of 3 "regular" questions in <div> elements and then use CSS to align those divs side-by-side with the array questions. CSS and jQuery details would depend on the question types and template.
I think you'll need to place the 2 groups of 3 "regular" questions in <div> elements and then use CSS to align those divs side-by-side with the array questions. CSS and jQuery details would depend on the question types and template.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
- RaCMJS
- Topic Author
- Offline
- Junior Member
Less
More
- Posts: 35
- Thank you received: 1
8 years 10 months ago #119737
by RaCMJS
Replied by RaCMJS on topic 2 arrays in the same group using "Multiple question types in array"
Tony,
Thanks for the reply. I don't understand why you said that this work around is not for arrays - the code I copied from the page I mentioned is specifically for arrays. I am uploading the survey so you can see what I mean (should have done this the first time). For some reason, the layout is not perfect on the default template, but it's good enough to demonstrate the issue. The code that creates the first side by side array for the first array is in the "blanskpace" questions source code in the survey. This bit works fine. Then, for the second side by side array the code is placed in the source code of r921q0.
In the example given on the workaround page, the instructions say that the code should specify number of rows, columns and start position of the side by side.
$(document).ready(function() {
// Call the "sideBySide" function with number of rows, columns and start position
sideBySide(4, 5, 3);
});
I am not sure if the reason this is not working in the second array is that position is variable based on the number of rows in the first array. If that is an issue - how do you get around that?
Many thanks!
Thanks for the reply. I don't understand why you said that this work around is not for arrays - the code I copied from the page I mentioned is specifically for arrays. I am uploading the survey so you can see what I mean (should have done this the first time). For some reason, the layout is not perfect on the default template, but it's good enough to demonstrate the issue. The code that creates the first side by side array for the first array is in the "blanskpace" questions source code in the survey. This bit works fine. Then, for the second side by side array the code is placed in the source code of r921q0.
In the example given on the workaround page, the instructions say that the code should specify number of rows, columns and start position of the side by side.
$(document).ready(function() {
// Call the "sideBySide" function with number of rows, columns and start position
sideBySide(4, 5, 3);
});
I am not sure if the reason this is not working in the second array is that position is variable based on the number of rows in the first array. If that is an issue - how do you get around that?
Many thanks!
Attachments:
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10611
- Thank you received: 3690
8 years 10 months ago - 8 years 10 months ago #119738
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic 2 arrays in the same group using "Multiple question types in array"
Because I wrote the " Multiple question types in array " workaround and it is not for array type questions - it is to simulate an array with different single-answer question types.I don't understand why you said that this work around is not for arrays...
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 8 years 10 months ago by tpartner.
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10611
- Thank you received: 3690
8 years 10 months ago - 8 years 10 months ago #119746
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic 2 arrays in the same group using "Multiple question types in array"
After looking at your survey, I see that you are not using array type questions but are applying the sideBySide() function more than once on a page which it was not intended to handle. Additionally, you have the wrong start number for the second group (should be 42) and I don't understand your use of long-text questions instead of text-displays.
Having said that, here is a modified script that should handle your case:
Here is the sample group with that script in the source of "blankspace" (q5):
Having said that, here is a modified script that should handle your case:
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { // Call the "sideBySide" function with number of rows, columns and start position sideBySide(11, 3, 5); sideBySide(4, 3, 42); }); function sideBySide(rows, columns, startQuestion) { /*********** Display multiple questions side by side ***********/ var rowNum = 0; var colNum = 1; var rowList = new Array(); var numQuestions = rows*columns; var arrayID = $('div[id^="question"]:eq('+(startQuestion-1)+')').attr('id').replace(/question/, ''); //////// Add question classes for later use //////// // Loop through all questions and add row and column specific classes $('div[id^="question"]:lt('+((startQuestion+numQuestions)-1)+'):gt('+(startQuestion-2)+')').each(function(i) { $(this).addClass('qRow-'+arrayID+'-'+rowNum+'').addClass('qCol'+colNum+'').addClass('inlineQuestion'); if(rowNum == 0 && colNum > 1) { $(this).addClass('columnLabel'); } if(rowNum > 0 && colNum == 1) { $(this).addClass('rowLabel'); } else if(rowNum > 0 && colNum > 1) { $(this).addClass('questionCell'); } if(colNum == columns) { rowList.push('qRow-'+arrayID+'-'+rowNum+''); rowNum++; colNum = 1; } else { colNum++; } }); //////// Survey layout manipulation //////// // Fix the width of the survey $('table.outerframe').css({ 'width': '900px' }); // Wrap each "row" in a wrapper div $(rowList).each(function(i) { $('.'+this+'').wrapAll('<div id="inlineWrapper'+i+'" class="inlineRow array-'+arrayID+'-row" />'); }); $('.array-'+arrayID+'-row').append('<div style="clear:both;" >'); $('.array-'+arrayID+'-row:last').after('<div style="clear:both; padding-bottom: 20px;" >'); // Style the wrapper divs $('.inlineRow').css({ 'width': '850px', 'margin': '0 auto 0 auto', 'clear': 'both' }); $( '.inlineRow:first' ).css({ 'margin-top': '10px' }); // Get all the questions to sit politely side by side $( '.inlineQuestion' ).css({ 'float': 'left', 'height':'41px', 'overflow':'hidden', 'margin-bottom': '-8px' }); $( '.inlineQuestion .questionhelp' ).hide(); $( '.inlineQuestion .survey-question-help' ).parent().hide(); // Any questions not displayed inline (this is only needed if there are questions following the "inline" questions) $( '.normalQuestion' ).css({ 'clear': 'both' }); //////// Column manipulation //////// // Set the column widths - can be set individually if necessary // Must add up to less than 100% $( '.qCol1' ).css({ 'width': '20%' }); $( '.qCol2, .qCol3, .qCol4, .qCol5' ).css({ 'width': '39%' }); //////// Question manipulation //////// // Hide the answer element in boilerplate questions $( 'div.boilerplate td.answer' ).parent().hide(); // Hide the question text elements in non-boilerplate questions $('div.questionCell td.questiontext').parent().hide(); // Push the question tables to 100% $( 'div.inlineRow table' ).css({ 'width': '100%' }); // Get everything to line up nicely vertically $( '.inlineQuestion td.questiontext, .inlineQuestion td.answer p' ).css({ 'text-align': 'center' }); // Adjust cell heights so everything lines up nicely horizontally $( '.inlineQuestion td.answer, .inlineQuestion td.questiontext' ).css({ 'height':'35px', 'overflow':'hidden', 'padding':'0.5em' }); $( '#inlineWrapper0 .inlineQuestion' ).css({ 'height':'50px' }); $( '#inlineWrapper0 td.questiontext' ).css({ 'height':'50px' }); // Yes-no question styles $( 'div.yes-no ul' ).css({ 'text-align': 'center', 'font-size': '90%', 'margin': '0', 'padding-bottom': '5px' }); $( 'div.yes-no li' ).css({ 'padding-right': '1.5em' }); $( 'div.yes-no td.answer' ).css({ 'padding-bottom': '0' }); // Short-text question styles $( 'div.text-short input' ).css({ 'width': '125px', 'margin-left': '0' }); // Numeric question styles $( 'div.numeric input' ).css({ 'width': '125px', 'margin-left': '0' }); $( 'div.numeric p.tip' ).css({ 'display': 'none' }); // Get rid of the margins around select boxes $( 'p.question' ).css({ 'margin':'0' }); } </script>
Here is the sample group with that script in the source of "blankspace" (q5):
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last edit: 8 years 10 months ago by tpartner.
The topic has been locked.