Placing this script in the question source will result in the following behaviour:
- When selecting the last option in a scale-1 drop-down, the scale-2 drop-down in that row will also be set to its last option and disabled.
- Selecting any but the last option in a scale-1 drop-down will enable the scale-2 drop-down in that row.
Code:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// Identify this question
var thisQuestion = $('#question{QID}');
// Assign classes
$('tr.subquestion-list', thisQuestion).each(function(i){
$('td.answer-item', this).each(function(i){
$(this).addClass('scale-'+(i+1));
});
});
// Some vars...
var excludeValue1 = $('td.answer-item:eq(0) option:last', thisQuestion).attr('value');
var excludeValue2 = $('td.answer-item:eq(1) option:last', thisQuestion).attr('value');
// Listener on the dropdowns
$('.scale-1 select', thisQuestion).change(function(e) {
var thisRow = $(this).closest('tr');
if($(this).val() == excludeValue1) {
$('.scale-2 select', thisRow).val(excludeValue2).prop('disabled', true);
}
else if($('.scale-2 select', thisRow).is(':disabled')){
$('.scale-2 select', thisRow).prop('disabled', false);
}
});
// Initial states
$('.scale-1 select', thisQuestion).each(function(i) {
var thisRow = $(this).closest('tr');
if($(this).val() == excludeValue1) {
$('.scale-2 select', thisRow).val(excludeValue2).prop('disabled', true);
}
});
// Remove any "disabled" properties befor submitting
$('#movenextbtn, #movesubmitbtn').bind('click', function () {
$('select', thisQuestion).prop('disabled', false);
});
});
</script>
