- Posts: 10103
- Thank you received: 3591
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Combine several questions types into one grid, using newest template
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
4 years 6 months ago - 4 years 6 months ago #189693
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 Combine several questions types into one grid, using newest template
You need to use :nth-child(2) in the selector as the table cells in the first answer column are actually the second child in each row (the sub-question text is in the first child).
- api.jquery.com/nth-child-selector/
Sample survey attached:
- api.jquery.com/nth-child-selector/
Code:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { var thisQuestion = $('#question{QID}'); // Insert selects into last column $('.answer-item:nth-child(2)', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\ <option value="">Please choose...</option>\ <option value="1">Option 1</option>\ <option value="2">Option 2</option>\ <option value="2">Option 3</option>\ <option value="2">Option 4</option>\ </select>'); // Listeners $('.inserted-select', thisQuestion).on('change', function(i) { var thistextInput = $(this).closest('.answer-item').find('input:text'); if($(this).val() != '') { $(thistextInput).val($.trim($('option:selected', this).text())).trigger('change'); } else { $(this).closest('.answer-item').find('input:text').val('').trigger('change'); } checkconditions($(thistextInput).attr('value'), $(thistextInput).attr('name'), $(thistextInput).attr('type')); }); // Returning to page $('.with-select input:text', thisQuestion).each(function(i) { var thisCell = $(this).closest('.answer-item'); var inputText = $.trim($(this).val()); var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val(); $('select.inserted-select', thisCell).val(selectval); }); // Clean-up styles $('select.inserted-select', thisQuestion).css({ 'max-width': '100%' }); $('.with-select input:text', thisQuestion).css({ 'position': 'absolute', 'left': '-9999em' }); }); </script>
Sample survey attached:
You can use browser developer tools (F12) to explore the HTML elements.Also, is there a list somewhere with the codes used to access the different parts of the answer so I can learn to do this by myself? I am new to java scripting but would really like to learn...
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 4 years 6 months ago by tpartner.
The topic has been locked.
- asilbering
- Offline
- Senior Member
Less
More
- Posts: 74
- Thank you received: 1
4 years 6 months ago #189695
by asilbering
Replied by asilbering on topic Combine several questions types into one grid, using newest template
Thanks Tony!
Have a nice day,
Ana
Have a nice day,
Ana
The topic has been locked.