Welcome to the LimeSurvey Community Forum

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

Search by Keyword

Find Posts from

Sort Results by

Search at a specific date

Jump to Result Number

Search in Categories Also search in sub-categories

Search Results (Searched for: exclusive-item)

ngolub

12 Mar 2024 17:22

Replied by ngolub on topic Implementation eines Sliders in der 2ten Skala eines Dual Arrays.

Ja, das habe ich auch gemacht.

Der erste Script sieht so aus:

Code:

<script type="text/javascript" charset="utf-8">
 
// Script zuum Einfügen der Checkboxen anstelle der Textfelder und Einstellen der Exclusivität
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
 
    // Insert checkboxes
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5', thisQuestion).addClass('custom-checkbox-item');
    $('.custom-checkbox-item', thisQuestion).each(function(i) {
      var thisID = $('input:text:eq(0)', this).attr('id');
      $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
      if($('input:text:eq(0)', this).val() == 'Y') {
        $('input:checkbox:eq(0)', this).prop('checked', true);
      }
      $(this).removeClass('text-item').addClass('checkbox-item');
      $('input:text:eq(0)', this).remove();
    });
 
    // Identify exclusive items
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5', thisQuestion).addClass('exclusive-item');
 
    // Listeners for exclusive items
    $('.non-exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
// Dies könnte man gesamt löschen
//    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
//      if($.trim($(this).val()) != '') {
//        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
//      }
//    });
 
    $('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        var thisItem = $(this).closest('.answer-item');
        $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
//        $(this).closest('tr.subquestion-list').find('input:text').val('');
      }
    });
 
</script>

ngolub

12 Mar 2024 17:14

Replied by ngolub on topic Implementation eines Sliders in der 2ten Skala eines Dual Arrays.

Danke dir für die schnelle Antwort.

Habe diese Zeilen gelöscht, aber der Sliderwert wird trotzdem nicht gespeichert, wenn ich es vor dem anklicken der Checkboxes verschiebe.

Das habe ich gelöscht:

Code:

// Dies könnte man gesamt löschen
//    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
//      if($.trim($(this).val()) != '') {
//        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
//      }
//    });

Joffm

12 Mar 2024 17:03

Replied by Joffm on topic Implementation eines Sliders in der 2ten Skala eines Dual Arrays.

Ja, wenn man darauf gestoßen wird, kommt gleich die Erleuchtung.
Das Ganze stammt ja aus diesem Beispiel

Hier waren die exclusiven Checkboxen ja wirklich dazu da, auch die Textfelder zu löschen.
Wir haben aber den Slider im Textfeld, der nun nicht gelöscht werden sollte.

Also kommentiere diese Zeilen aus - oder lösche sie!

Code:

    // Listeners for exclusive items
    $('.non-exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
// Dies könnte man gesamt löschen
//    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
//      if($.trim($(this).val()) != '') {
//        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
//      }
//    });
 
    $('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        var thisItem = $(this).closest('.answer-item');
        $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
//        $(this).closest('tr.subquestion-list').find('input:text').val('');
      }
    });

Sorry

Joffm

ngolub

11 Mar 2024 12:23

Replied by ngolub on topic Implementation eines Sliders in der 2ten Skala eines Dual Arrays.

Update: Nach dem Clearing des Chaches kann ich hier wieder wie gewohnt posten.

So, wie bereits erwähnt wird der Slider nur in der ersten Reihe implementiert:

Hier ist der Code:

Code:

<p><strong>10. Wie wichtig sind die nachfolgenden General Management-Kompetenzen <u>bezogen auf Ihre aktuelle Führungsposition?</u></strong></p>
<script type="text/javascript" charset="utf-8">
 
// Script zuum Einfügen der Checkboxen anstelle der Textfelder und Einstellen der Exclusivität
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Column-specific classes
    $('tr.subquestion-list', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
 
    // Insert checkboxes
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5', thisQuestion).addClass('custom-checkbox-item');
    $('.custom-checkbox-item', thisQuestion).each(function(i) {
      var thisID = $('input:text:eq(0)', this).attr('id');
      $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
      if($('input:text:eq(0)', this).val() == 'Y') {
        $('input:checkbox:eq(0)', this).prop('checked', true);
      }
      $(this).removeClass('text-item').addClass('checkbox-item');
      $('input:text:eq(0)', this).remove();
    });
 
    // Identify exclusive items
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5', thisQuestion).addClass('exclusive-item');
 
    // Listeners for exclusive items
    $('.non-exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.non-exclusive-item input:text', thisQuestion).on('keyup change', function(e) {
      if($.trim($(this).val()) != '') {
        $(this).closest('tr.subquestion-list').find('.exclusive-item input:checkbox').prop('checked', false);
      }
    });
    $('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
      if($(this).is(':checked')) {
        var thisItem = $(this).closest('.answer-item');
        $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
        $(this).closest('tr.subquestion-list').find('input:text').val('');
      }
    });
  });
</script><script type="text/javascript" data-author="Tony Partner">
 
// Script zum Einfügen der Slider in die 6. Spalte der Matrix
 
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // The column to receive the sliders
    var sliderColumn = 6;
 
    var thisQuestion = $('#question{QID}');
    var nextQuestion = thisQuestion.nextAll('.numeric-multi:eq(0)');
 
     // Hide the next question
    nextQuestion.hide();
 
    //Remove the core array text inputs
    $('tr[id^="javatbd"] .answer-item:nth-child('+(sliderColumn+1)+') input', thisQuestion).remove();
 
 
    // Wait for the sliders to be inititialized
    $('input:text', nextQuestion).on('slideEnabled',function(){
 
      var thisItem = $(this).closest('li');
      var thisItemIndex = thisItem.index();
 
      // Move the slider and add some styling
      $('tr[id^="javatbd"]:eq('+thisItemIndex+') .answer-item:nth-child('+(sliderColumn+1)+')', thisQuestion).append($('.slider-container', thisItem));
      $('tr[id^="javatbd"]:eq('+thisItemIndex+') .slider-container', thisQuestion)
        .removeClass('col-xs-12 col-sm-12')
        .css({
          'display': 'block',
          'padding': '25px 10px 0 10px'
        });
    });
  });
</script><script type="text/javascript" charset="utf-8">
 
// Script zum Einfügen des zusätzlichen Headers
 
  $(document).on('ready pjax:scriptcomplete',function(){
    // Insert the column categories
    $('#question{QID} table.subquestion-list thead tr:eq(0) td:eq(0)').remove();
    $('#question{QID} table.subquestion-list thead').prepend('<tr class="ls-heading">\
      <td rowspan="2" colspan="1" style="border-top:0 !important;"></td>\
      <th class="answer-text inserted-header" colspan="5">Zum gegenwärtigen Zeitpunkt<br/>(heute)</th>\
      <th class="answer-text inserted-header" colspan="1"><em>Veränderung</em> der Bedeutung zukünftig<br/>(in 5-10 Jahren)</th>\
    </tr>');
  });
</script><script type="text/javascript">
 
// Script zum Einfügen des Zwischenzeilen
// Beachte: In dieser Matrix wird "subquestion-list" angesprochen, nicht "answers-list", wie in einer eindimensionalen Matrix
 
  $(document).ready(function() {
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Define the sub-heading text strings with tooltip text using the title attribute
    var subHeading1 = '<strong title="Your detailed information for Leadership">Leadership</strong>';
    var subHeading2 = '<strong title="Your detailed information for Academic Environment">Handeln im akademischen Umfeld</strong>';
    var subHeading3 = '<strong title="Your detailed information for Political Environment">Handeln im politischen Umfeld</strong>';
    var subHeading4 = '<strong title="Your detailed information for Strategic Design">Strategisches Gestaltungsvermögen</strong>';
    var subHeading5 = '<strong title="Your detailed information for Business Thinking">Betriebswirtschaftliches Denken und Handeln</strong>';
    var subHeading6 = '<strong title="Your detailed information for Organizational Change">Den organisatorischen Wandel gestalten</strong>';
 
    // Find out the number of columns in the question
    var columnsLength = $('tr.subquestion-list:eq(0) > *', thisQuestion).length;
 
    // Insert the subheadings before the specific subquestions
    $('tr.subquestion-list:eq(0)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading1+'</th></tr>');
    $('tr.subquestion-list:eq(5)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading2+'</th></tr>');
    $('tr.subquestion-list:eq(10)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading3+'</th></tr>');
    $('tr.subquestion-list:eq(15)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading4+'</th></tr>');
    $('tr.subquestion-list:eq(19)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading5+'</th></tr>');
    $('tr.subquestion-list:eq(24)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading6+'</th></tr>');
 
    // Fix the row classes for styling
    var rowClass = 1;
    $('table.subquestion-list tbody tr', thisQuestion).each(function(i) {
      if($(this).hasClass('sub-header-row')) {
        rowClass = 1;
      } else {
        rowClass++;
        $(this).removeClass('array1 array2');
        if(rowClass % 2 == 0) {
          $(this).addClass('array2');
        } else {
          $(this).addClass('array1');
        }
      }
    });
    // Initialize Bootstrap tooltips
    $('[data-bs-toggle="tooltip"]').tooltip();
  });
</script><script type="text/javascript" charset="utf-8">
 
// Script zur Nummeriereung der Spalten für die individuelle Spaltenbreite
 
  $(document).on('ready pjax:scriptcomplete',function(){
    var thisQuestion = $('#question{QID}');
    // Add a question class
    thisQuestion.addClass('custom-array');
 
    // Column-specific classes
    $('table.subquestion-list tr', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column1-'+i);
      });
    });
  });
</script>
<style type="text/css">/* Individuelle Sapltenbreiten */
  .custom-array table.subquestion-list col {
    width: auto !important;
  }
 
  .custom-array table.subquestion-list thead .column1-0 {  width: 28%; }
  .custom-array table.subquestion-list thead .column1-1 {  width: 45%; }
  .custom-array table.subquestion-list thead .column1-2 {  width: 27%; }
</style>
<style type="text/css">@media (min-width: 768px) {
    .col-md-8 {
      flex: 0 0 auto;
      flex-grow: 0;
      width: 100%;
    }
  }
 
/* Teilfragentexte linksbündig */
  .ls-answers tbody .answertext {
    text-align: left;
  }
 
/* Diverse Anweisungen, um den Slider zu stylen */
  .slider.slider-horizontal {
    width: 100%;
    height: 20px;
  }
  
  .slider-handle {
    background: #007894;
  }
  
  .slider-track {
    background-image: linear-gradient(to bottom, #E2E2E2 ,#E2E2E2);
    background-repeat: repeat-x;
    box-shadow: 0;
    border-radius: 10px;
    position: absolute;
    cursor: pointer;
  }
  
   .slider-selection {
    background-image: linear-gradient(to bottom, #E2E2E2 ,#E2E2E2);
    border-radius: 10px;
  }
  
  /* Change the slider handle color */
.slider-handle.min-slider-handle.round {
  background-color: #007894;
  border: 2px solid #007894;
}
 
 
  .slider.slider-horizontal .slider-track {
    height: 20px;
    width: 100%;
    margin-top: 0;
    top: 0;
    left: 0;
    border-radius: 10px;
  }
 
  .slider-container {
    padding: 2px 2px !important;
  }
 
  /* Tooltip des Sliders, falls er überhaupt angezeigt werden soll */
  .slider .tooltip-inner {
    min-width:10px;
    height:auto;
    padding:3px 3px;
    color:#314A5B;
    text-align:center;
    font-weight:400;
    border-radius:5px;
    border: 1px solid #314A5B;
    background-color:white;
    font-size: 12px;
 }
 
  /* Diverse Anweisungen, um die ursprünglichen Checkboxen wie Radio-Buttons aussehen zu lassen */
  .checkbox-item .ls-label-xs-visibility {
    width: 18px;
    height: 18px;
  }
  .checkbox-item label::before, .checkbox-item label::after {
    border-radius: 50%;
  }
  .checkbox-item label::before {
    border-color: black;
    width:18px;
    height:18px;
  }
  .checkbox-item input[type="checkbox"]:checked + label::after {
    content:"";
    background: #007894;
    padding: 0;
  }
  #question{QID} .checkbox-item label::after {
    width: 10px;
    height: 10px;
    left: 4px;
    top: 4px;
  }
 
  .tooltip[data-toggle="tooltip"] {
    cursor: pointer;
  }
 
  /* Styles for your .mytooltip1 elements */
  .mytooltip1 {
    cursor: pointer;
    font-weight: bold;
    color: #007894;
  }
 
 
.tooltip-inner{
    min-width:500px;
    height:auto;
    padding:3px 8px;
    color:#314A5B;
    text-align:left;
    font-weight:400;
    border-radius:15px;
    border: 1px solid #314A5B;
    background-color:white;
    font-size: 16px;
  }
 
/* Farbgebung der beiden Skalen */
  td.answer_cell_1,
  td.answer_cell_2,
  td.answer_cell_3,
  td.answer_cell_4,
  td.answer_cell_5,
  tr.ls-header th.answertext.column1-0,
  tr.ls-header th.answertext.column1-1,
  tr.ls-header th.answertext.column1-2,
  tr.ls-header th.answertext.column1-3,
  tr.ls-header th.answertext.column1-4,
  th.inserted-header.column1-1 {
  background-color:  rgba(232, 225, 208);
  }
 
  td.answer_cell_6,
  tr.ls-header th.answertext.column1-5,
  th.inserted-header.column1-2 {
  background-color: rgba(211, 222, 239);
  }
  
  .sub-header-row th {
    color: #96272D;
}
</style>
<style type="text/css">/* Hide the red warning message for mandatory multiple choice questions */
  div.ls-question-mandatory-multiplechoice,
  div.ls-question-mandatory.ls-question-mandatory-other-text-danger,
  div.ls-question-mandatory.ls-question-mandatory-other,
  /* Add the class for mandatory multiple numerical input questions */
  div.ls-question-mandatory.ls-question-mandatory-array.text-danger {
      display: none;
  }
</style>

Und hier ist noch das lss.

File Attachment:

File Name: limesurvey...5222.lss
File Size:984 KB

Sieht du wo das Problem liegt?

tpartner

23 Jan 2024 15:19 - 23 Jan 2024 15:21

Replied by tpartner on topic Disable specific columns checkboxes if condition in array (numbers)

Here is more efficient version:

Code:

<script type="text/javascript" data-author="Tony Partner">
 
    $(document).on('ready pjax:scriptcomplete',function(){
 
        var thisQuestion = $('#question{QID}')
 
        // Add some classes to the checkbox cells
        // 3rd children (answer column 2)
        $('td.checkbox-item:nth-child(3)', thisQuestion).addClass('exclusive-item');        
        // 4th and above children (answer columns greater than 2)
        $('td.checkbox-item:nth-child(n+4)', thisQuestion).addClass('excluded-item');
 
        // A listener on the exclusive checkboxes
        $('.exclusive-item input:checkbox', thisQuestion).on('change', function (event) {
            handleExclusive($(this));
        });
 
        // Returning to page
        $('.exclusive-item input:checkbox', thisQuestion).each(function (i) {
            handleExclusive($(this));
        });
 
        function handleExclusive(thisInput) {
 
            var thisCell = $(thisInput).closest('td'); 
            var thisRow = $(thisCell).closest('tr');
 
            if(thisInput.is(':checked')) {
                // Enable the excluded checkboxes
                $('.excluded-item input:checkbox', thisRow).prop('disabled', false);
            }
            else {
                // Uncheck the excluded boxes in a row
                $('.excluded-item input[type="hidden"]', thisRow).val('');
                $('.excluded-item input:checkbox', thisRow).prop('checked', false).trigger('change').prop('disabled', true);
            }
        }
    });
</script>

Sample survey attached:

File Attachment:

File Name: limesurvey...5841.lss
File Size:35 KB

bellagambad

23 Jan 2024 13:35 - 23 Jan 2024 15:12

Replied by bellagambad on topic Disable specific columns checkboxes if condition in array (numbers)

Of course, and I'm sorry if you saw my message as a lack of respect or consideration for your work. On the contrary, your help (and that of tpartner and DenisChenu) is greatly appreciated. From my past experiences on the forum (which is small), either the answer arrives quickly, or it doesn't. So I preferred to post again because of the short deadline imposed on me at work. Please accept my apologies.
So thank you very much for your reply and I'll see if I can find the solution with these indications using chatgpt. I have virtually no skills with this language so the latter could help.
Thanks again!
David

EDIT : with a couple of back and forth with ChatGPT and using tpartner's code and your input, I ended up with the following code, that seems to do what I want

Code:

<script type="text/javascript" data-author="DBEL">
  $(document).ready(function() {
    // Call the exclude function using question ID
    excludeOpt({QID});
  });
 
  // A function to set up exclusivity
  function excludeOpt(qID) {
    var thisQuestion = $('#question' + qID);
 
    // Set up exclusivity for each row
    thisQuestion.find('tr.subquestion-list').each(function() {
      setupRowExclusivity($(this));
    });
 
    // A listener on the checkboxes
    thisQuestion.find('input[type="checkbox"]').on('change', function(event) {
      handleExclusive($(this));
    });
 
    function setupRowExclusivity(row) {
      row.find('td.checkbox-item').each(function(index) {
        if (index === 1) {
          $(this).addClass('exclusive-item');
        } else if (index === 0) {
          $(this).addClass('neutral-item');
        } else {
          $(this).addClass('normal-item');
        }
      });
 
      $('.exclusive-item input[type="hidden"]', row).val('');
 
      // Initially disable the normal items
      $('.normal-item input[type="checkbox"]', row).prop('disabled', true);
    }
 
    function handleExclusive(thisInput) {
      var thisCell = thisInput.closest('td');
      var thisRow = thisInput.closest('tr');
 
      if ($(thisCell).hasClass('neutral-item')) {
        // Do nothing or add specific logic for the neutral item
      } else if ($(thisCell).hasClass('exclusive-item')) {
        // If exclusive item is checked, enable/disable normal items accordingly
        var normalItems = $('.normal-item input[type="checkbox"]', thisRow);
        normalItems.prop('disabled', !thisInput.is(':checked'));
        if (!thisInput.is(':checked')) {
          normalItems.prop('checked', false);
        }
      }
 
      // Check conditions (relevance)
      $('td.checkbox-item', thisRow).each(function() {
        var thisValue = $('input[type="checkbox"]', this).is(':checked') ? 1 : '';
        var thisSGQA = $('input[type="checkbox"]', this).attr('id').replace(/cbox_/, '');
 
        $('input[type="hidden"]', this).attr('value', thisValue);
        fixnum_checkconditions(thisValue, thisSGQA, 'hidden');
      });
    }
  }
</script>

Gerard Martínez Görbig

25 Oct 2023 16:18

Update code for Exclusive options in Array(Number) with Checkboxes? was created by Gerard Martínez Görbig

Your LimeSurvey version: LimeSurvey Cloud Version 6.3.0
==================
Hi everyone,
I have a question with an Array with checkboxes, and I want to make the last one exclusive. I found several topics in the forums relating to this, but none works. I also checked the manual and any material related.
The last code I tried is this one:

<script type="text/javascript" charset="utf-8">
   $(document).on('ready pjax:scriptcomplete',function(){

       var thisQuestion = $('#question{QID}')

       // Add some classes to the checkbox cells
       $('td.checkbox-item:last-child', thisQuestion).addClass('exclusive-item');

       // A function to un-check boxes
       function resetCheckbox(thisItem) {
           $(':hidden', thisItem).val('');
           $(':checkbox', thisItem).prop('checked', false).trigger('change');
       }

       // A listener on the checkboxes
       $(':checkbox', thisQuestion).on('change', function(e) {
           if($(this).is(':checked')) {
               var thisItem = $(this).closest('.answer-item');
               var thisRow = $(this).closest('tr');
               var items = $('td.answer-item.exclusive-item', thisRow);
               if($(thisItem).hasClass('exclusive-item')) {
                   items = $('td.answer-item:not(.exclusive-item)', thisRow);
               }
               $.each(items, function(i, el) {
                   resetCheckbox(el);
               });
           }
       });
   });
</script>

Find the sample question in the file attached.

I hope someone can help. I'm not fluent in java to do any huge changes in the code. I also tried to adjust all options I could find, but still not working.
Thank you very much,
Best

Joffm

21 Oct 2023 17:32

Replied by Joffm on topic Array with first text and then with radiolist

Hi, why did yoou switch to this thread, insted of staying in your "old" one?

Okay.
1. I thought you'd like to have one checkbox and two text fields.
But I see only two items on the x-scale

2. I wrote "Adapt the script". You did not.
Didn't you see this line in the script?

Code:

// Insert checkboxes
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('custom-checkbox-item');

Here you see, that in this example (easy to see if you compared with the screenshot) checkboxes are inserted into columns 1,2,3,4,7,8.
Remove what is not needed.

Furthermore I wrote about the "exclusiveness" of checkboxes.
This you see here

Code:

    // Identify exclusive items
    $('.answer-item.column-1, .answer-item.column-2, .answer-item.column-3, .answer-item.column-4, .answer-item.column-5, .answer-item.column-6', thisQuestion).addClass('non-exclusive-item');
    $('.answer-item.column-7, .answer-item.column-8', thisQuestion).addClass('exclusive-item');
 
    // Listeners for exclusive items

till the end.

If you don't want to use it, remove. too.

But please keep the last clisong brackets.

Joffm

Joffm

10 Aug 2023 15:22 - 10 Aug 2023 15:29

Replied by Joffm on topic Suffix nach Textfeld in Matrix

Hallo, Sarina,
hier Deine Umfrage mit der "neuen" Matrix.

File Attachment:

File Name: limesurvey...7948.lss
File Size:169 KB

Was ist alles darin?
Zunächst die Darstellung als Matrix.
Dann die Eingabemaske.
Linksbündige Darstellung der Items
Zentrierung der Radio-Buttons.
Unterschiedliche Spaltenbreiten, falls gewünscht.
Check, dass maximal 3-stellige Zahlen eingegeben werden können.
Da durch den hinzugefügten Text die Eingabemaske ja ziemlich vergewaltigt wird, wird in eqQ2 dann dieser entfernt, damit in der Datenbank nur der Wert steht.

Was fehlt?
a. Check, ob ein Teilnehmer einen Wert einträgt, dann aber "noch nie" anklickt.
b. Check, ob ein Teilnehmer keinen Wert einträgt, dann aber "Tag", "Woche", anklickt.

a. Könnte man z.B. abfangen, indem in der Gleichungsfrage eqQ2 noch hinzugefügt wird, dass der Wert in Q2a_SQ001 geleert wird wenn Q2_SQ001==9 (9="noch nie")
b. Das wäre noch ein Validierungspunkt, ähnlich wie der der dreistelligen Zahlen.

Was geht nicht?
Logischerweise können die Items nun nicht in zufälliger Reihenfolge angezeigt werden, da die Textfrage, die ja mittels des scriptes eingefügt wird, in der normalen Reihenfolge vorliegt.

Wichtige Stellen im script
Die Breite der eingefügten Spalte:

Code:

$('.inserted-column-label', qArray).css('width','15%');

Hier das Textfeld eingefügt und gleichzeitig die Maske definiert.
"mal pro" muss dann ins Englische übersetzt werden.

Code:

$('input[type="text"]', this).appendTo($('tr.answers-list:eq('+i+') .text-item', qArray)).mask('##0 mal pro ...', { 
   reverse: true,
   placeholder: "__ mal pro ..." 
});

Und hier wird die Spaltenbreite der einzelnen Spalten bestimmt (sollte zusammen 100% ergeben)

Code:

<style type="text/css">
  .custom-array table.subquestion-list col {
    width: auto !important;
  }
  .custom-array table.subquestion-list thead .column-0 {  width: 50%; }
  .custom-array table.subquestion-list thead .column-1 {  width: 15%; }
  .custom-array table.subquestion-list thead .column-2 {  width: 6%; }
  .custom-array table.subquestion-list thead .column-3 {  width: 6%; }
  .custom-array table.subquestion-list thead .column-4 {  width: 6%; }
  .custom-array table.subquestion-list thead .column-5 {  width: 6%; }
  .custom-array table.subquestion-list thead .column-6 {  width: 11%; }

Okay, jetzt etwas zur den anderen Dingen.
Deine Idee in "Hauf" mit der Mehrfachnennung ist im Grunde recht gut.
Allerdings zielte das Beispiel ja darauf, dass die Texteingabe eine weitere Option zusätzlich zu den anzucheckenden ist.
Und dann gab es die zwei exklusiven Option "Gar nicht" und "keine Angabe".

Dann muss ein evtl. eingegebener Text natürlich gelöscht werden.
Die entscheidende Stelle im script ist auch leicht zu finden

Code:

$('.exclusive-item input:checkbox', thisQuestion).on('change', function(e) {
            if($(this).is(':checked')) {
                var thisItem = $(this).closest('.answer-item');
                $(this).closest('tr.subquestion-list').find('.answer-item').not(thisItem).find('input:checkbox').prop('checked', false);
                $(this).closest('tr.subquestion-list').find('input:text').val('');
            }
        });

Also: Wenn ein exclusives Item gecheckt ist, dann wird der Wert (val) des Textes auf "leer" gesetzt.
Wenn Du diese Zeile entfernst, funktioniert auch Dein "Hauf".
Jedenfalls fast. Denn, wenn "Noch nie" gewählt wird, sollte der Text ja geleert werden.
D.h. Du musst diesem Item eine andere Klasse geben, z.B. "exclusive-item2" und dann am Schluss den Text leeren, wenn dieses Item gewählt wurde.
Habe ich auch einmal gemacht (ich bin ja freundlich

Jetzt aber zur ersten Gruppe
F22: Hier wolltest Du wohl des Beispiel der Lückentexte einbauen. Halte ich auch für eine interessante Idee.
Diese Frage "von - bis" lässt sich doch gut mit Drop-Downs lösen.
Es kommt ja nicht auf die Minute an.
Könnte so aussehen.

Ist auch drin.

Aber was ist denn dieses?
var thisSelect = $('#question{19776} input[id^="answer"]:eq(0)');
Dort stand sicher einmal $('#question{QID}
Wie Du hoffentlich jetzt weißt, sind dies LimeSurvey-spezifische Platzhalter, die immer durch den aktuellen Wert ersetzt werden.
{SID} : SurveyID
{GID} : GruppenID
{QID} : FragenID
{SAVEDID} : ID des Datensatzes in der Antworttabelle
{EXPIRY} : Enddatum der Umfrage (falls angegeben)
und andere.
Das heißt, in scripten wird dies NICHT geändert.
Wenn schon hättest Du $('#question19776 schreiben müssen.
Problem ist ja: Wenn Du die Umfrage kopierst oder exportierst und wieder importierst, werden diese Werte - wenn sie hart hineingeschrieben werden - nicht angepasst.

Und als Letztes:
Du schriebst, dass es einen mixed mode geben soll (paper pencil und online)
Nun, dass sind nun zwei unterschiedliche Methoden und für jede sollte das dafür geeignete Design gewählt werden.
Einer meiner Kunden schickt ebenfalls immer noch Papier, gleichzeitig wird aber auch die Beantwortung online angeboten.
Und das sind zwei Fragebögen mit ganz unterschiedlichem Design, eben an die Arbeitsweise beim Beantworten angepasst
Man kann einen paper pencil-Bogen nicht sklavisch nach online transferieren.
Eher würde es noch umgekehrt gehen.
Bei einem Papierbogen gibt es deutlich mehr Erklärungsbedarf (und man weiß "Papier ist geduldig"); trotzdem wird der Teilnehmer Gott weiß was ankreuzen und hinschreiben.
Im Gegensatz dazu sollte ein Online-Fragebogen mit kurzen Texten auskommen. (Eine Skala, die angezeigt wird, muss nicht im Fragetext noch einmal erklärt werden.) Hier wird ja zusätzlich durch Validierung viel "Unsinn" abgefangen.
Und eben das Prinzip "Eine Frage pro Seite"

Und das Programmierprinzip lautet ja "mobile first".
D.h. Du entwickelst den Fragebogen für ein mobiles Endgerät. Dabei siehst Du bereits, bei welchen Ideen, eine Frage darzustellen, es Probleme gibt.
Verschiebe einmal einen Slider auf einem smartphone und ähnliches.

Zum Fragebogen-Design dies als zusätzliche Anregung (der Autor war auch lange Zeit hier aktiv und hat viele Ideen eingebracht)

File Attachment:

File Name: surveyfrie...8-10.zip
File Size:977 KB

Jetzt mach was draus
Viel Erfolg

Joffm

Joffm

11 May 2023 11:40

Replied by Joffm on topic Combine array question with radio button or checkbox

Hi,

I need to do something similar

But only at first glance.
The other solution was based on an array
As you can imagine this is quite different as an array allows only one response per row.
But here you expect three responses per row

You may use an array(text) and insert checkboxes.
Then you have to handle that each pair is exclusive.

Here's a script I adapted from a former solution of @tpartner.

Code:

<script type="text/javascript" charset="utf-8">  
    
    $(document).on('ready pjax:scriptcomplete',function(){
 
        // Identify this question
        var thisQuestion = $('#question{QID}');
 
        // Column-specific classes
        $('tr.subquestion-list', thisQuestion).each(function(i) {
            $('th, td', this).each(function(i) {
                $(this).addClass('column-'+i);
            });
        });
        
        // Insert checkboxes
        $('.answer-item.column-2, .answer-item.column-4, .answer-item.column-6', thisQuestion).addClass('custom-checkbox-item');
        $('.custom-checkbox-item', thisQuestion).each(function(i) {
            var thisID = $('input:text:eq(0)', this).attr('id');
            $('label', this).before('<input class="" id="'+thisID+'" value="Y" type="checkbox" name="'+thisID.replace(/answer/, '')+'" />');
            if($('input:text:eq(0)', this).val() == 'Y') {
                $('input:checkbox:eq(0)', this).prop('checked', true);
            }
            $(this).removeClass('text-item').addClass('checkbox-item');
            $('input:text:eq(0)', this).remove();
        });
        
        // Identify exclusive items
        $('.answer-item.column-1, .answer-item.column-2', thisQuestion).addClass('exclusive-item1');
        $('.answer-item.column-3, .answer-item.column-4', thisQuestion).addClass('exclusive-item2');
        $('.answer-item.column-5, .answer-item.column-6', thisQuestion).addClass('exclusive-item3');
        
        // Listeners for exclusive items
        $('.exclusive-item1 input:text', thisQuestion).on('keyup change', function(e) {
            if($.trim($(this).val()) != '') {
                $(this).closest('tr.subquestion-list').find('.exclusive-item1 input:checkbox').prop('checked', false);
            }
        });
        $('.exclusive-item1 input:checkbox', thisQuestion).on('change', function(e) {
            if($(this).is(':checked')) {
                var thisItem = $(this).closest('.answer-item');
                $(this).closest('tr.subquestion-list').find('.exclusive-item1 input:text').val('');
            }
        });
 
        $('.exclusive-item2 input:text', thisQuestion).on('keyup change', function(e) {
            if($.trim($(this).val()) != '') {
                $(this).closest('tr.subquestion-list').find('.exclusive-item2 input:checkbox').prop('checked', false);
            }
        });
        $('.exclusive-item2 input:checkbox', thisQuestion).on('change', function(e) {
            if($(this).is(':checked')) {
                var thisItem = $(this).closest('.answer-item');
                $(this).closest('tr.subquestion-list').find('.exclusive-item2 input:text').val('');
            }
        });
 
        $('.exclusive-item3 input:text', thisQuestion).on('keyup change', function(e) {
            if($.trim($(this).val()) != '') {
                $(this).closest('tr.subquestion-list').find('.exclusive-item3 input:checkbox').prop('checked', false);
            }
        });
        $('.exclusive-item3 input:checkbox', thisQuestion).on('change', function(e) {
            if($(this).is(':checked')) {
                var thisItem = $(this).closest('.answer-item');
                $(this).closest('tr.subquestion-list').find('.exclusive-item3 input:text').val('');
            }
        });
 
    });
</script>

Additionally you may adapt the column width and the background colors

Code:

<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function(){
    var thisQuestion = $('#question{QID}');
    // Add a question class
    thisQuestion.addClass('custom-array');
 
    // Column-specific classes
    $('table.subquestion-list tr', thisQuestion).each(function(i) {
      $('th, td', this).each(function(i) {
        $(this).addClass('column-'+i);
      });
    });
  });
</script>
<style type="text/css">.custom-array table.subquestion-list col {
    width: auto !important;
  }
 
  .custom-array table.subquestion-list thead .column-0 {  width: 25%; }
  .custom-array table.subquestion-list thead .column-1 {  width: 15%; }
  .custom-array table.subquestion-list thead .column-2 {  width: 10%; background-color:#efefef; }
  .custom-array table.subquestion-list thead .column-3 {  width: 15%; }
  .custom-array table.subquestion-list thead .column-4 {  width: 10%; background-color:#efefef; }
  .custom-array table.subquestion-list thead .column-5 {  width: 15%; }
  .custom-array table.subquestion-list thead .column-6 {  width: 10%; background-color:#efefef; }

  .custom-array table.subquestion-list td.column-2,
  .custom-array table.subquestion-list td.column-4,
  .custom-array table.subquestion-list td.column-6 {
    background-color:#efefef;
  }
</style>

What is left for you?
The validation. That each row contains exactly three responses.

Joffm

tpartner

25 Apr 2023 12:00 - 25 Apr 2023 12:02

Replied by tpartner on topic Exclusive option in Array (Numbers) with checkboxes

See this post - forums.limesurvey.org/index.php/forum/ca...erical-matrix#218665

You will need to modify the script for a single exclusive row.

Change this:

Code:

$('tr.subquestion-list', thisQuestion).slice(-2).find('td.answer-item').addClass('exclusive-item');

To this:

Code:

$('tr.subquestion-list:last', thisQuestion).find('td.answer-item').addClass('exclusive-item');

Displaying 1 - 11 out of 11 results.

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Search Results (Searched for: exclusive-item)

File Attachment:

File Attachment:

File Attachment:

File Attachment:

Lime-years ahead

Legal

About Us

Open Source

All Categories
English support forums
- News
- Installation & update issues
- Design issues
- Can I do this with LimeSurvey?
- Development
- Future features
- Plugins
- ComfortUpdate
- LimeStore
Localized forums
- Chinese forum
- Dutch forum
- French forum
- Deutsches Forum
- Italian forum
- Portuguese forum
- Spanish forum
Third-party components
- Offline surveys Android app

Welcome to the LimeSurvey Community Forum

Advanced Search

Search Options

Search Results (Searched for: exclusive-item)

File Attachment:

File Attachment:

File Attachment:

File Attachment:

Lime-years ahead

Legal

About Us

Open Source