I don't like the idea of hiding the rows as they are answered without any indication of the answer because it gives no opportunity to fix mistaken clicks.
Code:
<script type="text/javascript">
$(document).on('ready pjax:scriptcomplete',function(){
// A function to show subsequent rows of an array as options are checked
function expandingArray(qID) {
var thisQuestion = $('#question'+qID);
$('table.ls-answers', thisQuestion).hide();
// Delay to let the relevence be set
setTimeout(function(){
// Build an array of the question rows
var arrayRows = $('table.ls-answers tbody tr.radio-list:not(.ls-irrelevant)', thisQuestion);
// Initially hide all rows unless an input was previously checked
$(arrayRows).addClass('relevant-row').each(function(i) {
if ($('input:radio:checked', this).length != 0) {
$(this).attr('data-name', 'clickedRow');
}
else {
$(this).attr('data-name', 'hidden').hide();
}
});
// Now show the first hidden row
addRow();
$('table.ls-answers', thisQuestion).show();
// Add another row when an option is checked for the first time
$( 'td.answer-item input:radio', thisQuestion).on('click', function (event) {
var thisRow = $(this).closest('tr');
if ($(thisRow).attr('data-name') != 'clickedRow') {
addRow();
$(thisRow).attr('data-name', 'clickedRow');
// if you also want to hide the answered row:
$(thisRow).hide();
}
// The original function of the click event
checkconditions(this.value, this.name, this.type);
if ($(thisRow).is('#question'+qID+' .relevant-row:last')) {
setTimeout(function(){
$(thisQuestion).hide();
$('#ls-button-submit').trigger('click');
}, 200);
}
});
}, 500);
// Function to add a row
function addRow() {
$('.relevant-row[data-name="hidden"]:first' ).attr('data-name', 'visible').show();
// Now, scroll down
$("html, body").animate({ scrollTop: $(document).height() }, 1000);
}
}
// Call the function with a question ID
expandingArray({QID});
});
</script>
