Have an idea?

Visit Sawtooth Software Feedback to share your ideas on how we can improve our products.

Mutually Exclusive in Free Format question

Hi,
I have a free format multi select question (here is the variables/Question syntax)

<style type="text/css">
td, th {
    border: 1px solid #D3D3D3;
}
td.tch, th {
    border: 0px solid;
}
</style>

<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_1">[%CheckSelect(S4_A, 1)%]<label for="S4_A_1">Smartphone</label></td>
    </tr>
</table>


<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_2">[%CheckSelect(S4_A, 2)%]<label for="S4_A_2">Tablet</label></td>
    </tr>
</table>

<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_3">[%CheckSelect(S4_A, 3)%]<label for="S4_A_3">Laptop or desktop computer (PC or Mac)</label></td>
    </tr>
</table>



<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_4">[%CheckSelect(S4_A, 4)%]<label for="S4_A_4">Video game console - including handheld (e.g., Xbox, PlayStation, Nintendo Switch, DS, PSP, etc.)</label></td>
    </tr>
</table>


<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_5">[%CheckSelect(S4_A, 5)%]<label for="S4_A_5">Streaming Devices (e.g., Smart TV, Apple TV, Roku, Amazon Fire TV/stick, Chromecast, TiVo)</label></td>
    </tr>
</table>

<table width="70%" cellpadding="5" cellspacing="" border="thin">
    <tr>
        <td class="clickable" align="left" id="S4_other_6">[%CheckSelect(S4_A, 6)%]<label for="S4_A_6">None of the above</label></td>
    </tr>
</table>



I have hided all the check boxes and made to click on the responses instead of check boxes using the below code

<script type="text/javascript">
$(document).ready(function ($) {
for (i = 1; i <= 6; i++)
{
document.getElementById("S4_A_" + i + "_graphical").visibility = 'hidden';
document.getElementById("S4_A_" + i + "_graphical").disabled = 'true';
document.getElementById("S4_A_" + i + "_graphical").className = 'HideElement';
}

})

</script>


<script>
$(document).ready(SSI_CustomGraphicalCheckbox);
 
function SSI_CustomGraphicalCheckbox(graphical, input) {
    $('#[% QuestionName() %]_div td.clickable').css('background-color', 'transparent');
    for (var j = 1; j <= 6; j++) {
    if (SSI_GetValue('[% QuestionName() %]_A_' + j)) {
        $('#[% QuestionName() %]_A_' + j).closest('td.clickable').css('background-color', '#218EBC');
    }
}
}
</script>

<style>
.freeformat .clickable.highlight {
    background-color: #218EBC !important;
}
</style>


My survey page looks like below,

https://ibb.co/kcb8PTr

I can able to select multi options, now I want to make option 'None' as exclusive. Please help me by changing the below code to work as per my request.

<script>
$(document).ready(SSI_CustomGraphicalCheckbox);
 
function SSI_CustomGraphicalCheckbox(graphical, input) {
    $('#[% QuestionName() %]_div td.clickable').css('background-color', 'transparent');
    for (var j = 1; j <= 6; j++) {
    if (SSI_GetValue('[% QuestionName() %]_A_' + j)) {
        $('#[% QuestionName() %]_A_' + j).closest('td.clickable').css('background-color', '#218EBC');
    }
}
}
</script>
asked Mar 30 by Abdul Bronze (2,630 points)

1 Answer

+1 vote
 
Best answer
Does this work?

<script>
$(document).ready(SSI_CustomGraphicalCheckbox);

function SSI_CustomGraphicalCheckbox(graphical, input, bln) {
    if (bln) {
        var match = input.id.match(/^[% QuestionName() %]_A_(\d+)$/);
        if (match) {
            var item = Number(match[1]);
            if (item == 6) {
                for (var i = 1; i <= 5; i++) {
                    SSI_SetSelect('[% QuestionName() %]_A_' + i, false);
                }
            }
            else {
                SSI_SetSelect('[% QuestionName() %]_A_6', false);
            }
        }
    }

    $('#[% QuestionName() %]_div td.clickable').css('background-color', 'transparent');
    for (var j = 1; j <= 6; j++) {
        if (SSI_GetValue('[% QuestionName() %]_A_' + j)) {
            $('#[% QuestionName() %]_A_' + j).closest('td.clickable').css('background-color', '#218EBC');
        }
    }
}
</script>
answered Mar 30 by Zachary Platinum Sawtooth Software, Inc. (147,925 points)
selected Mar 30 by Abdul
Yes, This is what I want. Thank you so much Zachary.
...