In migrating from a version 2.x installation to 3.x, I've lost a critical function for our DISC survey using an Array by Column question type.
There are two screenshots attached: "not working" is from my current installation (v3.x). "working" is from my previous installation (v2.x).
The user is supposed to select an item which "Most" and "Least" represents them. Obviously, they are mutually exclusive, so the JavaScript code is supposed to disable the corresponding "Least" when a "Most" answer is selected and vice versa.
There are also two lss files attached.
> limesurvey_survey_186194.lss is not working (Version 3.16.0+190225)
> limesurvey_survey_451344.lss is working (Version 2.72.3+171020)
As a bonus, the rows are shuffled with another piece of JavaScript. This portion is definitely working, so I am completely confident that the JavaScript code is deployed and firing. (To make sure, I temporarily added a console.log statement after the var thisQuestion declaration.)
Here's the JavaScript that is part of the theme's custom.js:
Code:
/******************************************
* Begin DISC manipulation script
******************************************/
function shuffleArray(array) {
for (var i = array.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = array[i];
array[i] = array[j];
array[j] = temp;
}
return array;
}
$(document).on('ready pjax:complete',function() {
// Identify this question
var thisQuestion = $('.array-flexible-column:eq(0)');
var elements = $('tr.answers-list', thisQuestion).detach().toArray();
shuffleArray(elements);
$('tr.answers-list', thisQuestion).remove();
$.each(elements, function(i, el) {
$('table.subquestion-list tbody:eq(0)', thisQuestion).append(el);
});
});
$(document).ready(function() {
// Identify the questions -- FOR DISC
var thisQuestion = $('[id^=question]');
// Listener on the radios
$('input.radio', thisQuestion).on('click', function(e) {
$('input[type="radio"]', thisQuestion).prop('disabled', false);
$('input.radio:checked', thisQuestion).each(function(i) {
$(this).closest('tr.answers-list').find('input[type="radio"]').not(this).prop('disabled', true);
});
});
// Initial settings
$('input.radio:checked', thisQuestion).each(function(i) {
$(this).closest('tr.answers-list').find('input[type="radio"]').not(this).prop('disabled', true);
});
});
/******************************************
* End DISC manipulation script
******************************************/
In debugging this, my observation is that
Code:
$('input.radio', thisQuestion).on('click', function(e) {
is not appended to the [input:radio] buttons on the new server instance. As far as I can see, the old version does nothing to append this event and I've not been able to make that happen in code.
When I dug in deeper, I noticed the event "checkconditions" is not present in the new version:
Old:
Code:
<input class="radio" type="radio" name="451344X410X7685SM" value="D1" id="answer451344X410X7685SM-D1"
onclick="checkconditions(this.value, this.name, this.type)">
New:
Code:
<input type="radio" name="186194X76X854SM" value="S1" id="answer186194X76X854SM-S1">
My question is this: did something change between versions?
