Thank you Bigred, that was helpful!
I did those changes in the script and css, and now there is no problem with the opening secondary options
Just had to write in css without the /!important/ part, though. A warning sign appeared in the css file about it, and the solution in fact only worked after I removed it.
I think the best part from Limesurvey is this forum. I'm learning loads with you people. thanks
Just in case someone else needs this solution, I write here how it looks like now:
Template.js
Code:
// A function to handle "secondary" checkboxes
function secondaryCheckboxes(qID, primaryPosition, secondaryCount) {
// Identify the elements
var thisQuestion = $('#question'+qID);
var primaryRow = $('li.question-item:eq('+(primaryPosition-1)+')', thisQuestion);
var primaryInput = $('input.checkbox', primaryRow);
var secondaryRows = primaryRow.nextAll('li.question-item:lt('+(secondaryCount)+')');
var secondaryInputs = $('input.checkbox', secondaryRows);
// Indent the secondaries
secondaryRows.css({ 'margin-left':'2.5em' });
// Initial states of the secondary answers
if (primaryInput.prop('checked') == false ) {
secondaryRows.addClass('display-none')
}
// A listener on the primary answer to show or hide secondary answers
primaryInput.click(function (event) {
// Hide/show the secondary answers accordingly
if (!$(this).is(':checked')) {
secondaryRows.addClass('display-none')
secondaryInputs.prop('checked', false);
secondaryInputs.each(function(i) {
checkconditions(this.value, this.name, this.type);
});
}
else {
secondaryRows.removeClass('display-none')
}
});
}
Template.css:
Code:
.display-none {
display:none;
}