To add something to holch's answer.
You can merge the questions by css classes "no-question" and "no-bottom".
Search the forum for the definition.
Other approach.
Insert subheaders by javascript
Here the script that you have to adapt to your answer options.
Code:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// Identify this question
var thisQuestion = $('#question{QID}');
// Define the sub-heading text strings
var subHeading1 = '<th></th><th>AA 1</th><th>AA 2</th><th>AA 3</th><th>AA 4</th><th>AA 5</th><th>AA 6</th><th>AA 7</th>';
var subHeading2 = '<th></th><th>AB 1</th><th>AB 2</th><th>AB 3</th><th>AB 4</th><th>AB 5</th><th>AB 6</th><th>AB 7</th>';
var subHeading3 = '<th></th><th>CA 1</th><th>CA 2</th><th>CA 3</th><th>CA 4</th><th>CA 5</th><th>CA 6</th><th>CA 7</th>';
// Insert the new rows
$('tr.answers-list:eq(0)', thisQuestion).before('<tr class="sub-header-row">'+subHeading1+'</tr>');
$('tr.answers-list:eq(1)', thisQuestion).before('<tr class="sub-header-row">'+subHeading2+'</tr>');
$('tr.answers-list:eq(2)', thisQuestion).before('<tr class="sub-header-row">'+subHeading3+'</tr>');
// Fix up the row classes
var rowClass = 1;
$('table.subquestions-list tbody tr', thisQuestion).each(function(i) {
if($(this).hasClass('sub-header-row')) {
rowClass = 1
}
else {
rowClass++;
$(this).removeClass('array1 array2')
if(rowClass % 2 == 0) {
$(this).addClass('array2');
}
else {
$(this).addClass('array1');
}
}
});
});
</script>
and some css
Code:
<style type="text/css">.sub-header-row {
margin-bottom: 20px;
}
.sub-header-row th {
background-color: #efefef;
color: #000000 !important;
text-align: center;
}
tr.ls-heading {
display:none;
}
</style>
Joffm
