Welcome to the LimeSurvey Community Forum

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

Problem with exlusive rows in Array(numbers) with checkboxes

boemsel
Topic Author
Offline
New Member

More

2 years 8 months ago - 2 years 8 months ago #227592 by boemsel

Problem with exlusive rows in Array(numbers) with checkboxes was created by boemsel

Please help us help you and fill where relevant:
Your LimeSurvey version: Version 5.2.2+211115
Own server or LimeSurvey hosting: Own Server
Survey theme/template: bootswatch
==================

Dear All,

I am trying to set the first row of an array(number) with checkboxes as exclusive and disable all other checkboxes in that column if it is checked. Using the script found in this thread ( forums.limesurvey.org/forum/can-i-do-thi...lusive-option#168915 ) and slightly modify it to use the first row, I can get it to work.

But there seems to be a problem if i am using multiple questions in the same way: Say I have 2 independent questions which are arrays(numbers) with checkboxes and for each, the first row shall be exclusive.
When I now check the first row in the first question, the columns in the second question are also deactivated. If i check the first row in the second question, the columns in the first question are deactivated. But I need the exclusive option of one question to be independent from the other question, otherwise using the exclusive option on one questions renders all other questions useless. (I hope my problem is understandable).

I have attached a *.lss file (with two test-questions) and a screenshot.

Thank you all in advance!

Attachments:

Last edit: 2 years 8 months ago by boemsel.

Please Log in to join the conversation.

tpartner
Offline
LimeSurvey Community Team

More

2 years 8 months ago #227597 by tpartner

Replied by tpartner on topic Problem with exlusive rows in Array(numbers) with checkboxes

Here is an updated version of that script:

Code:

<script type="text/javascript" data-author="Tony Partner">  
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var qID = '{QID}';
    var thisQuestion = $('#question'+qID);
 
    // Add column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('> *', this).each(function(i) {
        $(this).addClass('column-'+i).attr('data-column', i);
      });
    });
 
    // Add some classes to the checkbox cells
    $('td.checkbox-item', thisQuestion).addClass('normal-opt');
    $('tr[id^="javatbd"]:first td.checkbox-item', thisQuestion).removeClass('normal-opt').addClass('exclusive-opt');
 
    // A listener on the checkboxes
    $('td.checkbox-item input[type="checkbox"]', thisQuestion).change(function (event) {
      handleExclusive($(this).closest('td'));
    });
 
    function handleExclusive(thisCell) {
 
      var thisColumn = $(thisCell).attr('data-column');
      var thisCheckBox = $('input[type="checkbox"]', thisCell);
 
      // Uncheck the appropriate boxes in a column
      $('.checkbox-item[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('disabled', false);
      if ($(thisCell).hasClass('normal-opt') &amp;&amp; $(thisCheckBox).is(':checked')) {
        $('.exclusive-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.exclusive-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change');
      }
      else if ($(thisCheckBox).is(':checked')) {
        $('.normal-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.normal-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change').prop('disabled', true);
      }
    }
  });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...2(1).lss
File Size:37 KB

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

The following user(s) said Thank You: boemsel

Please Log in to join the conversation.

boemsel
Topic Author
Offline
New Member

More

2 years 8 months ago #227608 by boemsel

Replied by boemsel on topic Problem with exlusive rows in Array(numbers) with checkboxes

Thank you Tony, you're a life-saver!!

Would it be possible to add an (optional) code which also makes it so that if you check the most right box on the first row, *all* other boxes of the question would be deactivated?

Please Log in to join the conversation.

tpartner
Offline
LimeSurvey Community Team

More

2 years 8 months ago #227615 by tpartner

Replied by tpartner on topic Problem with exlusive rows in Array(numbers) with checkboxes

Try this (untested) script:

Code:

<script type="text/javascript" data-author="Tony Partner">  
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var qID = '{QID}';
    var thisQuestion = $('#question'+qID);
 
    // Add column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('> *', this).each(function(i) {
        $(this).addClass('column-'+i).attr('data-column', i);
      });
    });
 
    // Add some classes to the checkbox cells
    $('td.checkbox-item', thisQuestion).addClass('normal-opt');
    $('tr[id^="javatbd"]:first td.checkbox-item', thisQuestion).removeClass('normal-opt').addClass('exclusive-opt');
    $('tr[id^="javatbd"]:first td.checkbox-item:last', thisQuestion).addClass('master-exclusive-opt');
 
    // A listener on the checkboxes
    $('td.checkbox-item input[type="checkbox"]', thisQuestion).change(function (event) {
      handleExclusive($(this).closest('td'));
    });
 
    function handleExclusive(thisCell) {
 
      var thisColumn = $(thisCell).attr('data-column');
      var thisCheckBox = $('input[type="checkbox"]', thisCell);
 
      // Uncheck the appropriate boxes in a column
      $('.checkbox-item[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('disabled', false);
      if ($(thisCell).hasClass('master-exclusive-opt') &amp;&amp; $(thisCheckBox).is(':checked')) {
        $('td.checkbox-item:not(.master-exclusive-opt) input:hidden', thisQuestion).val('');
        $('td.checkbox-item:not(.master-exclusive-opt) input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change').prop('disabled', true);
      }
      else if ($(thisCell).hasClass('normal-opt') &amp;&amp; $(thisCheckBox).is(':checked')) {
        $('.exclusive-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.exclusive-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change');
      }
      else if ($(thisCheckBox).is(':checked')) {
        $('.normal-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.normal-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change').prop('disabled', true);
      }
    }
  });
</script>

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

The following user(s) said Thank You: boemsel

Please Log in to join the conversation.

boemsel
Topic Author
Offline
New Member

More

2 years 8 months ago #227618 by boemsel

Replied by boemsel on topic Problem with exlusive rows in Array(numbers) with checkboxes

Thanks again Tony!

Generally the script seems to work fine. But: if you check the most right box in the first row (whcih then deactivates all other boxes) and then uncheck it, only the most right column gets unchecked, all other boxes stay checked and there's no way to uncheck them.

Please Log in to join the conversation.

tpartner
Offline
LimeSurvey Community Team

More

2 years 8 months ago #227620 by tpartner

Replied by tpartner on topic Problem with exlusive rows in Array(numbers) with checkboxes

Code:

<script type="text/javascript" data-author="Tony Partner">  
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    var qID = '{QID}';
    var thisQuestion = $('#question'+qID);
 
    // Add column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('> *', this).each(function(i) {
        $(this).addClass('column-'+i).attr('data-column', i);
      });
    });
 
    // Add some classes to the checkbox cells
    $('td.checkbox-item', thisQuestion).addClass('normal-opt');
    $('tr[id^="javatbd"]:first td.checkbox-item', thisQuestion).removeClass('normal-opt').addClass('exclusive-opt');
    $('tr[id^="javatbd"]:first td.checkbox-item:last', thisQuestion).addClass('master-exclusive-opt');
 
    // A listener on the checkboxes
    $('td.checkbox-item input[type="checkbox"]', thisQuestion).change(function (event) {
      handleExclusive($(this).closest('td'));
    });
 
    function handleExclusive(thisCell) {
 
      var thisColumn = $(thisCell).attr('data-column');
      var thisCheckBox = $('input[type="checkbox"]', thisCell);
 
      // Uncheck the appropriate boxes in a column
      $('.checkbox-item[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('disabled', false);
      if ($(thisCell).hasClass('master-exclusive-opt') &amp;&amp; $(thisCheckBox).is(':checked')) {
        $('.checkbox-item[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('disabled', false);
        $('td.checkbox-item:not(.master-exclusive-opt) input:hidden', thisQuestion).val('');
        $('td.checkbox-item:not(.master-exclusive-opt) input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change').prop('disabled', true);
      }
      else if ($(thisCell).hasClass('master-exclusive-opt')) {
        $('.checkbox-item input[type="checkbox"]', thisQuestion).prop('disabled', false);
      }
      else if ($(thisCell).hasClass('normal-opt') &amp;&amp; $(thisCheckBox).is(':checked')) {
        $('.exclusive-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.exclusive-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change');
      }
      else if ($(thisCheckBox).is(':checked')) {
        $('.normal-opt[data-column="'+thisColumn+'"] input:hidden', thisQuestion).val('');
        $('.normal-opt[data-column="'+thisColumn+'"] input[type="checkbox"]', thisQuestion).prop('checked', false).trigger('change').prop('disabled', true);
      }
    }
  });
</script>

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

The following user(s) said Thank You: boemsel

Please Log in to join the conversation.

boemsel
Topic Author
Offline
New Member

More

2 years 8 months ago #227628 by boemsel

Replied by boemsel on topic Problem with exlusive rows in Array(numbers) with checkboxes

Works fine! Thanks again Tony!

Please Log in to join the conversation.

Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Problem with exlusive rows in Array(numbers) with checkboxes

File Attachment:

Lime-years ahead

Legal

About Us

Open Source