No, that code only works for radio inputs.
This will do the trick for array-dual-scale questions using drop-downs in version 3.4.x.
(I have added the facility to hide or show the "N/A" option in the second scale)
Sample survey attached:
This will do the trick for array-dual-scale questions using drop-downs in version 3.4.x.
(I have added the facility to hide or show the "N/A" option in the second scale)
<script type="text/javascript" charset="utf-8">
$(document).on('ready pjax:scriptcomplete',function(){
// Identify this question
var thisQuestion = $('#question{QID}');
// Identify the "exclusive" answer(s) in scale one
// Multiple answers separated by commas are possible
var exclusiveValues = ['A4','A5'];
// Hide the "N/A" option in scale 2
// Set this to false if you want that option always visible
var hideNA = true;
// Identify the "N/A" value in scale 2
var naValue = $('select[id$="_1"]:eq(0) option:last', thisQuestion).attr('value');
// A function to handle the drop-down behaviour
function handleSelects(thisSelect) {
var selectVal = $(thisSelect).val();
var thisRow = $(thisSelect).closest('tr');
var exclusive = false;
$.each(exclusiveValues, function(i, val) {
if(selectVal == val) {
exclusive = true;
}
});
if(exclusive == true) {
if(hideNA == true) {
$('select[id$="_1"] option[value="'+naValue+'"]', thisRow).toggleOption(true);
}
$('select[id$="_1"]', thisRow).val(naValue).prop('disabled', true);
}
else {
$('select[id$="_1"]', thisRow).prop('disabled', false);
if(hideNA == true) {
$('select[id$="_1"] option[value="'+naValue+'"]', thisRow).toggleOption(false);
}
}
}
// Listener on the drop-downs
$('select[id$="_0"]', thisQuestion).on('change', function(e) {
handleSelects($(this));
});
// Initial states
$('select[id$="_0"]', thisQuestion).each(function(i) {
handleSelects($(this));
});
// On submit
$('#ls-button-submit').on('click', function(e) {
$('select[id$="_1"]', thisQuestion).prop('disabled', false);
});
});
$.fn.toggleOption = function(show) {
jQuery(this).toggle(show);
if(show) {
if( jQuery(this).parent('span.toggleOption').length)
jQuery(this).unwrap();
} else {
if(jQuery(this).parent('span.toggleOption' ).length == 0)
jQuery(this).wrap( '<span class="toggleOption" style="display: none;" />');
}
};
</script>
Sample survey attached: