I've actually found in the Forum a nice solution for the Workaround i mentioned (Variable length Array).
Code:
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
variableLengthTextArray({QID});
})
function variableLengthTextArray(qID) {
var thisQuestion = $('#question'+qID);
thisQuestion.addClass('variable-length-text-array');
// Insert some styles
$('<style type="text/css">\
.hidden {\
display: none !important;\
visibility: hidden !important;\
}\
.expandable-control:disabled {\
opacity: 0.3;\
}\
</style>').appendTo('head');
// Insert the controls
$('table.subquestions-list', thisQuestion).after('<div class="expandable-controls-wrapper">\
<button type="button" class="expandable-control remove">-</button>\
<button type="button" class="expandable-control add">+</button>\
</div>');
// Click events
$('.expandable-control.add', thisQuestion).click(function (event) {
$('tr.subquestion-list.hidden:first', thisQuestion).removeClass('hidden').addClass('shown');
handleArrayControls();
$('.expandable-control', thisQuestion).blur();
});
$('.expandable-control.remove', thisQuestion).click(function (event) {
$('tr.subquestion-list.shown:last', thisQuestion).removeClass('shown').addClass('hidden');
clearRows();
handleArrayControls();
$('.expandable-control', thisQuestion).blur();
});
function handleArrayControls() {
$('.expandable-control.remove', thisQuestion).prop('disabled', true);
if($('tr.subquestion-list:visible', thisQuestion).length > 1) {
$('.expandable-control.remove', thisQuestion).prop('disabled', false);
}
$('.expandable-control.add', thisQuestion).prop('disabled', false);
if($('tr.subquestion-list:visible', thisQuestion).length == $('tr.subquestion-list', thisQuestion).length) {
$('.expandable-control.add', thisQuestion).prop('disabled', true);
}
}
function clearRows() {
$('tr.subquestion-list.hidden input:text', thisQuestion).val('');
}
// Initially shown rows
$('tr.subquestion-list:eq(0)', thisQuestion).addClass('shown');
$('tr.subquestion-list:gt(0)', thisQuestion).addClass('hidden');
$('tr.subquestion-list input:text', thisQuestion).filter(function () {return !!this.value;}).closest('tr.subquestion-list').addClass('answered-row');
var thisQTable = $('table.subquestions-list', thisQuestion);
var thisQRows = $('.answered-row', thisQuestion);
var lastAnsweredRow = $('.answered-row:last', thisQuestion);
var lastAnsweredIndex = $('tr.subquestion-list', thisQTable).index(lastAnsweredRow);
$('tr.subquestion-list:lt('+(lastAnsweredIndex+1)+')', thisQuestion).removeClass('hidden').addClass('shown');
handleArrayControls();
}
</script>
