Welcome to the LimeSurvey Community Forum

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

Array (Numbers) Matrix - exclude some arrays from the Dropdown menu

  • DPetrik
  • DPetrik's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 9 months ago #185673 by DPetrik
Dear community,

i am new with limesurvey and did not found the out-of-the-box solution on how to edit the numbers from the dropdown menu in the matrix questiontype with numbers.

It was possible to exclude certain numbers by defining the steps (i.e. setting "2" will change the dropdown from 1,2,3,4,5 to 1,3,5).

However, my requirement is to define differing steps in certain number ranges. For my survey (Analytical Hierarchy Process) following numbers are required: 1/9, 1/7, 1/5, 1/3, 1, 3, 5, 7, 9. As you can see the range for excluded numbers differs, depending whether the numbers are <1 or >1.

Is it possible to make this logic work with LimeSurvey without Javascript? Maybe someone has a useful JS codesnipper i can start working with?

I would be thankful for any hint.

Kind Regards

DPetrik
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Online
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 9 months ago - 4 years 9 months ago #185675 by Joffm
Hi, DPetrik,

However, my requirement is to define differing steps in certain number ranges

Something like this?







You see, there are different answer options in each drop-down.
This is achieved by entering the following javascript into the question text of an array(text)
Code:
<script type="text/javascript" charset="utf-8">
$(document).on('ready pjax:scriptcomplete',function(){
  var thisQuestion = $('#question{QID}');
 
  // Insert selects
  $('.answer-item.answer_cell_X001', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
  <option value="">select...</option>\
  <option value="1">1</option>\
  <option value="2">2</option>\
  <option value="3">3</option>\
  <option value="4">4</option>\
  <option value="5">5</option>\
</select>');     
$('.answer-item.answer_cell_X002', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
  <option value="">select...</option>\
  <option value="1">1</option>\
  <option value="3">3</option>\
  <option value="5">5</option>\
</select>'); 
$('.answer-item.answer_cell_X003', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
  <option value="">select...</option>\
  <option value="1">1</option>\
  <option value="5">5</option>\
  <option value="7">7</option>\
  <option value="9">9</option>\
</select>'); 
$('.answer-item.answer_cell_X004', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
  <option value="">select...</option>\
  <option value="1">1</option>\
  <option value="5">5</option>\
  <option value="6">6</option>\
  <option value="7">7</option>\
  <option value="8">8</option>\
</select>'); 
 
    // Listeners
    $('.inserted-select', thisQuestion).on('change', function(i) {
      if($(this).val() != '') {
        $(this).closest('.answer-item').find('input:text').val($.trim($('option:selected', this).text())).trigger('change');
      }
      else {
        $(this).closest('.answer-item').find('input:text').val('').trigger('change');
      }
    });
 
    // Returning to page
    $('.with-select input:text', thisQuestion).each(function(i) {
      var thisCell = $(this).closest('.answer-item');
      var inputText = $.trim($(this).val());
      var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
      $('select.inserted-select', thisCell).val(selectval);
    });
 
    // Clean-up styles
    $('select.inserted-select', thisQuestion).css({
      'max-width': '100%'
    });
    $('.with-select input:text', thisQuestion).css({
      'position': 'absolute',
      'left': '-9999em'
    });
  });
</script>
But, sorry, this is a bit difficult to understand

following numbers are required: 1/9, 1/7, 1/5, 1/3, 1, 3, 5, 7, 9


Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 9 months ago by Joffm.
The following user(s) said Thank You: DPetrik
The topic has been locked.
  • DPetrik
  • DPetrik's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 9 months ago #185684 by DPetrik
Dear Joffm,

thank you very much for your suggestion. Your solution nearly fulfills my requirements.

In my survey the values should be identical in all editable cells but the distances between the values should be differing. I just have tried to implement your code and it works for me with two little issues.

I am not a coder and was not able to figure instantly out the reason for this two errors (see the attached screenshot):

1. $('.answer-item.answer-item.answer_cell_SQ00X) is applied for the whole column. If i try answer_cell_SQ00X_SQ00X the change is not applied.
2. The values are shown in a separate dropdown menu. Do i need to hide the initial drop down menu then?



Thank you a lot in advance.

Kind Regards

DPetrik
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Online
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 9 months ago #185692 by Joffm

1. $('.answer-item.answer-item.answer_cell_SQ00X) is applied for the whole column. If i try answer_cell_SQ00X_SQ00X the change is not applied.

Of course, this is the behaviour of a question of type array.
If you want to have different drop-down values within one column you may do this
// Insert selects
$('#javatbd371969X110X1123Y001 .answer-item.answer_cell_X001', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
<option value="">Please choose...</option>\
<option value="1">Yes</option>\
<option value="2">No</option>\
<option value="3">Do not know</option>\
</select>');
.
Meaning:
371969: SurveyID
110: GroupID
1123: QuestionID

On the other side you can use a simple array(numbers) without dropdowns and validate the entries.

2. The values are shown in a separate dropdown menu. Do i need to hide the initial drop down menu then?

It's an array(text) and the setting is "Only numbers= Off"

Joffm

Later I'll send an example.

BTW:
It's always recommended to send a sample of the survey "*.lss".
So we do not have to guess what you mean, which question types you use, and not have to create a survey by ourselves from scratch to find a soluton.

Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Online
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 9 months ago #185693 by Joffm
Hi, here the new script







Code:
<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function(){
    var thisQuestion = $('#question{QID}');
    // Insert selects
    $('#javatbd371969X110X18161Y001 .answer-item.answer_cell_X001', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
                          <option value="">select...</option>\
                          <option value="1">Y001_X001 1</option>\
                          <option value="2">Y001_X001 2</option>\
                          <option value="3">Y001_X001 3</option>\
                        </select>'); 
    $('#javatbd371969X110X18161Y001 .answer-item.answer_cell_X002', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
                          <option value="">select...</option>\
                          <option value="1">Red</option>\
                          <option value="2">Blue</option>\
                          <option value="3">Pink</option>\
                          <option value="4">Purple</option>\
                        </select>');  
    $('#javatbd371969X110X18161Y002 .answer-item.answer_cell_X001', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
                          <option value="">select...</option>\
                          <option value="1">AAA</option>\
                          <option value="2">BBB</option>\
                          <option value="3">CCC</option>\
                        </select>'); 
    $('#javatbd371969X110X18161Y002 .answer-item.answer_cell_X002', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
                          <option value="">select...</option>\
                          <option value="1">Y002_X002 1</option>\
                          <option value="2">Y002_X002 2</option>\
                          <option value="3">Y002_X002 3</option>\
                        </select>'); 
 
    // Listeners
    $('.inserted-select', thisQuestion).on('change', function(i) {
      if($(this).val() != '') {
        $(this).closest('.answer-item').find('input:text').val($.trim($('option:selected', this).text())).trigger('change');
      }
      else {
        $(this).closest('.answer-item').find('input:text').val('').trigger('change');
      }
    });
 
    // Returning to page
    $('.with-select input:text', thisQuestion).each(function(i) {
      var thisCell = $(this).closest('.answer-item');
      var inputText = $.trim($(this).val());
      var selectval = $('select.inserted-select option', thisCell).filter(function () { return $(this).html() == inputText; }).val();
      $('select.inserted-select', thisCell).val(selectval);
    });
 
    // Clean-up styles
    $('select.inserted-select', thisQuestion).css({
      'max-width': '100%'
    });
    $('.with-select input:text', thisQuestion).css({
      'position': 'absolute',
      'left': '-9999em'
    });
  });
</script>

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless
The topic has been locked.
  • DPetrik
  • DPetrik's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 9 months ago #185699 by DPetrik
Deqar Jeffm,


thank you for your reply. With your help i have nearly mastered this challenge :-)

The current version of the matrix-based survey now only has one issue. Attached you can see a screenshot of this issue:


Now each matrix contains two input elements/dropdown fields in each matrix field: the original one and the one with the class class="inserted-select form-control list-question-select".

Can i hide the initial field (for example the css addition display: none)? I assume this will impact the values stored in the database of the survey anyway. Maybe you have an idea how i can eliminate the initial dropdown menu?

I have also attached the .lss file as you suggested:

File Attachment:

File Name: limesurvey...15-2.lss
File Size:29 KB


Thank you a lot for your help!


Kind Regards

DPetrik
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Online
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
4 years 9 months ago - 4 years 9 months ago #185700 by Joffm
Here

This is achieved by entering the following javascript into the question text of an array(text)


and here

It's an array(text) and the setting is "Only numbers= Off"


I wrote that it is an array(text). You are still using an array(numbers).

With array(text)


Viel Glück
Joffm

P.S. If you use the array(numbers) set "Text Eingabefelder: An" in "Anzeige"
P.P.S. Your disabling doesn't seem to work. You disable "selects", but in these cells there are no "selects".

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 4 years 9 months ago by Joffm.
The following user(s) said Thank You: DPetrik
The topic has been locked.
  • DPetrik
  • DPetrik's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
4 years 9 months ago #185701 by DPetrik
Dear JoffM,


thank you! It was my mistake. I forgot to change the question type. With the array(text) question type now everything is working :-)

And you are right - the disabling does not work for this question type. But i will try to implement your hint from the other question tomorrow!

Thank you a lot for your great help! It is amazing! Vielen vielen Dank!
Kind Regards
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose