Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Multiple choice question: Uncheck same answer option

  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago #178914 by KompetenzZ
Hi,

I created two multiple choice questions, and placed the answer options vis-à-vis on the same level with JavaScript. I call these two answer option sets “increase” and “decrease”. They have the same answers. Is it possible to uncheck multiple choice answers across these two questions?
For example, when a certain secondary answer option in “increase” is checked and the respondent checks the same answer in “decrease”, the answer in “increase” should uncheck, vice versa. See picture.
Sorry, the answer options are in German.

Theme and survey is attached.

LS Version 3.14




File Attachment:

File Name: extends1_b...ix21.zip
File Size:192 KB

File Attachment:

File Name: limesurvey...3785.lss
File Size:67 KB

Cheers kompetenzz
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
5 years 3 months ago #178930 by tpartner
Assuming those are the only multiple choice questions in the group, adding something like this to the source of one question should do the trick:

Code:
<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function() {
 
    $('input:checkbox').on('change', function(i) {
      if($(this).is(':checked')) {
        // Identifyy some stuff...
        var thisQuestion = $(this).closest('.multiple-opt');
        var thisQID = thisQuestion.attr('id').replace(/question/, '');
        var otherQuestion = $('.multiple-opt').not(thisQuestion).first();
        var otherQID = otherQuestion.attr('id').replace(/question/, '');
        var thisCode = $(this).attr('id').split('X'+thisQID)[1];
 
        // Uncheck the check-box in the other question
        $('input:checkbox[id$="X'+otherQID+thisCode+'"]').prop('checked', false).trigger('change');
        $('input:hidden[id^="java"][id$="X'+otherQID+thisCode+'"]').val('');
      }
    });
  });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...7851.lss
File Size:68 KB

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago #178961 by KompetenzZ
Thank you for this javascript and sorry, I was too unprecise in my initial post. I should mention that I applied this workaround from the manual to display secondary answer options: manual.limesurvey.org/Workarounds:_Manip...meSurvey_version_3.x
Therefore the theme with the changes in “custom.css” is attached if necessary.

I would appreciate your help for applying the javascript only for the secondary answer options. I think the secondary answer options in the workaround from the manual are defined with "var secondaryRows", if this would be a help.

Now the answer option unchecks when I initially check a certain secondary option in "Decrease" (second question) and after that the same secondary option in "Increase" (first question). But when I do it in the reversed order, it does not work.

Hopefully the picture makes these considerations a bit clearer.


Cheers kompetenzz
The topic has been locked.
  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago - 5 years 3 months ago #178966 by KompetenzZ
Yep, sorry, I saw that you use the class ".multiple-opt" in your javascript and I think I inserted the answers of my second questions without this ".multiple-opt". It the has to do with my javascript to arrage the answer options at the same level and/or theme. I'll take a closer look. Your code is super correct.

As far as I can see it, I just would need to include this "var secondaryRows" in the if condition in order to trigger the javascript only on secondary answers. Could something like that be possible?
Code:
...
$('input:checkbox').on('change', function(i) {
        if($(this).is(':checked')) //...&amp;&amp; is/has a variable with the name secondaryRows// {
...

Cheers kompetenzz
Last edit: 5 years 3 months ago by KompetenzZ.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
5 years 3 months ago #179152 by tpartner
You have a couple of problems...

1) To identify the secondary rows, in custom.js, change this line:

Code:
secondaryRows.css({ 'margin-left':'2.5em' });
To this:
Code:
secondaryRows.addClass('secondary-item').css({ 'margin-left':'2.5em' });


2) You have somehow moved both answers lists into the same question so trying to identify items by question ID won't work. Use this as the "un-checking" script:

Code:
<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function() {
 
    // Add classes and attributes
    $('li.question-item').closest('ul').addClass('inserted-question-list');
    $('li.question-item').each(function(i) {
      $(this).attr('data-index', $(this).index());
    });
 
    $('body').on('change', '.secondary-item input:checkbox', function(i) {
      if($(this).is(':checked')) {
        // Identify some stuff...
        var thisQuestion = $(this).closest('.multiple-opt');
        var thisList = $(this).closest('ul.inserted-question-list');
        var otherList = $('.inserted-question-list', thisQuestion).not(thisList).first();
        var thisIndex = $(this).closest('li').attr('data-index');
        var otherItem = $('li[data-index="'+thisIndex+'"]', otherList);
 
        // Uncheck the check-box in the other question
        $('input:checkbox', otherItem).prop('checked', false).trigger('change');
        $('input:hidden', otherItem).val('');
      }
    });
  });
</script>

Sample survey and theme attached:

File Attachment:

File Name: limesurvey...1-12.lss
File Size:70 KB

File Attachment:

File Name: extends1_b...ix21.zip
File Size:192 KB

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago - 5 years 3 months ago #179156 by KompetenzZ
Wow, this is breathtaking. Thank you for your active participation and inputs in such a fruitful way. I appreciate that.

Yes, I moved both answers lists into the same question because that was the only idea I had for a correct display on smartphones. If the screen width is too small, the second answer list moves below the first one. I guess there are more elegant ways to achieve this :)

Again, this was a great help.


Just for documentation: if someone ever needs these questions with two column answer lists of secondary answer option questions or multiple numeric input questions: Some examples (see screenshot) are attached in the lss file (this lss file only works with the theme attached by tpartner in the post before this one). Sorry, the answer options are in german, but the logic should be understandable.



File Attachment:

File Name: limesurvey...4719.lss
File Size:118 KB

Cheers kompetenzz
Last edit: 5 years 3 months ago by KompetenzZ.
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose