Hi,

I am not sure if this is the right place to put my question. It seems a bug.
I have to two array questions.
The first is an array text question with both dropdown and "+""-" button.
I use scripts from this forums to add drop-list (Please see the script below) and use scripts from this link www.limesurvey.org/manual/Workarounds:_M...ble_Text.29_question to add "+""-" button.
Script to add drop-list:
<script>
$(document).on('ready pjax:scriptcomplete',function(){
var thisQuestion = $('#question{QID}');
$('tr.subquestion-list', thisQuestion).each(function(i) {
$('th, td', this).each(function(i) {
$(this).addClass('column-'+i);
});
});
//c3
if($('.answer-item.column-3 .inserted-select', thisQuestion).length == 0) {
$('.answer-item.column-3', thisQuestion).addClass('with-select').append('<select class="inserted-select form-control list-question-select">\
<option value="">--Choose house type--</option>\
<option value="1">House</option>\
<option value="2">Apartment</option>\
<option value="3">Dormitory</option>\
</select>');
}
//L
$('.inserted-select', thisQuestion).on('change', function(i) {
var thisInput = $(this).closest('.answer-item').find('input:text');
if($(this).val() != '') {
$(thisInput).val($.trim($('option:selected', this).text()));
checkconditions( $(thisInput).attr('value'), $(thisInput).attr('name'), 'text');
}
else {
$(thisInput).val('');
checkconditions( $(thisInput).attr('value'), $(thisInput).attr('name'), 'text');
}
});
//R
$('.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);
});
// C
$('select.inserted-select', thisQuestion).css({
'max-width': '100%'
});
$('.with-select input:text', thisQuestion).css({
'position': 'absolute',
'left': '-9999em'
});
});
</script>

The first question(Q1) looks like:
The second question(Q2) is a normal array question. I set conditions for subquestions so that subquestions will be shown only when the respondent doesn't choose "Dormitory" in the first question. For example, in the Q1, I choose "Apartment" for the first row and choose "Dormitory" for the second row. In the Q2, only the first row will be shown. It looks like:

The problem appears when I click "+""_" repeatedly.
For example:
1. I fill in two rows in Q1

2. I click "-" then "+"

Only the first cell shows empty so I fill this cell again and click "Next".
3. I go to the second question and it shows two rows (please see the picture below). But it is wrong because I choose "Dormitory" for the second row in Q1, the second row in Q2 should not be shown. In other words, that answer in Q1 is not recorded. It's a very big problem for me.


I hope I have explained my question clearly. Can anyone help? Thank you very much!
I am using LS 3+

You cannot call this a bug.
Don't forget: You combine two scripts that have been developed independently.
And both parts do exactly what they are made for.

Because it works if the respondent selects the drop down again, it should be sufficient to empty this field when adding or removing a row.

Next time please provide an *.lss export.
As we all are volunteers please ease our work. To be honest: I won't replicate your survey resp. the questions.

Joffm

Thank you for your reply, Joffm! I am so sorry for the forgotten *.lss export. I will attach it next time. Do you have some idea to avoid this issue? Is it possible to make the dropdown show "please choose" again after adding or removing a row? The current situation not only makes us lose data but also may mislead the respondent because one question is linking with another.

I still don't see a .lss file anywhere. Without that, we cannot help.

Hi,

Here is the .lss file. Thank you very much for your help.

I don't see any variable length array script in that .lss file.

Hi tpartner,

Do you mean you cannot see the script for adding "+""-" button?
If yes, I am so sorry because I am not the administrator and I have no access to add the script into template.js file. The original survey with this script is too long, so I have to create a text survey with only the relevant questions. Can I copy the following script to template.js file? I have already replaced QQ with QID in the following script.
I indeed need some help. Thank you!
$(document).ready(function() {

// A function to add or remove rows of an Array (Multi Flexible)(Text) question
function varLengthArray(qID) {

if ($('#question'+qID+'').length > 0) {

// The HTML content of the Add/Remove elements - modify as you wish
var addContent = '[+]';
var removeContent = '[-]';

// Create the Add and Remove elements & insert them
var el1 = document.createElement('div');
el1.setAttribute('id','addButton'+qID);
document.body.appendChild(el1);
var el2 = document.createElement('div');
el2.setAttribute('id','removeButton'+qID);
document.body.appendChild(el2);

// Move them to after the array
$( 'div#addButton'+qID ).appendTo($( '#question' + qID + ' table.ls-answers' ).parent());
$( 'div#removeButton'+qID ).appendTo($( '#question' + qID + ' table.ls-answers' ).parent());

// Insert their HTML
$( 'div#addButton'+qID ).html( addContent );
$( 'div#removeButton'+qID ).html( removeContent );

// Style the elements - you can modify here if you wish
$( 'div#addButton'+qID ).css({
'margin':'10px 0 0 10px',
'padding':'1px',
'text-align':'center',
'font-weight':'bold',
'width':'auto',
'cursor':'pointer',
'float':'left'
});

$( 'div#removeButton'+qID ).css({
'margin':'10px 0 0 10px',
'padding':'1px',
'text-align':'center',
'font-weight':'bold',
'width':'auto',
'cursor':'pointer',
'float':'left'
});

// Initially hide the Remove element
$( 'div#removeButton'+qID ).hide();

// Call the functions below when clicked
$( 'div#addButton'+qID ).click(function (event) {
addRow(qID);
});
$( 'div#removeButton'+qID ).click(function (event) {
removeRow(qID);
});

// Function to add a row, also shows the Remove element and hides the
//Add element if all rows are shown
function addRow(qID) {
var arrayRow = '#question' + qID + ' table.ls-answers tr.subquestion-list';
var rowCount = $( arrayRow ).size() - 1;
$( arrayRow + '[name="hidden"]:first' ).attr('name', 'visible').show();
$( 'div#removeButton'+qID ).show();
if ( $( arrayRow + ':eq(' + rowCount + ')' ).attr('name') == 'visible' ) {
$( 'div#addButton'+qID ).hide();
}
}

// Function to remove a row, also clears the contents of the removed row,
// shows the Add element if the last row is hidden and hides the Remove
// element if only the first row is shown
function removeRow(qID) {
var arrayRow = '#question' + qID + ' table.ls-answers tr.subquestion-list';
var rowCount = $( arrayRow ).size() - 1;
$( arrayRow + '[name="visible"]:last input[type="text"]' ).val('');
$( arrayRow + '[name="visible"]:last' ).attr('name', 'hidden').hide();
$( 'div#addButton'+qID ).show();
if ( $( arrayRow + ':eq(1)' ).attr('name') == 'hidden' ) {
$( 'div#removeButton'+qID ).hide();
}
}

// Just some initialization stuff
var arrayRow = '#question' + qID + ' table.ls-answers tr.subquestion-list';
var rowCount = '';

// Initially hide all except first row or any rows with populated inputs
$( arrayRow ).each(function(i) {
if ( i > 0 ) {
// We also need to give the hidden rows a name cause IE doesn't
// recognize jQuery :visible selector consistently
$( this ).attr('name', 'hidden').hide();

$('input[type=text]', this).each(function(i) {
if ($(this).attr('value') != '') {
$(this).parents('tbody:eq(0)').attr('name', 'visible').show();
$( 'div#removeButton'+qID ).show();
}
});
rowCount = i;
}
});
}
}

// Call the function with a question ID
varLengthArray(161200);

});

Replace this line:


With this:

Perfect! It works well! Thank you!