Bug in Cell Input Labels on Mobile

Question

Hi, I've just discovered a bug in the mobile version of a grid question. When using a constructed list for the row labels and having different cell input labels for every row, the cell input labels are correct for the desktop version but wrong for the mobile version. Example: When we show items 6, 2, 3, in the desktop version cell input labels 6, 2, 3 show up, wheras in the mobile version cell input labels 1, 2, 3 show up. Perhaps a developer should have a view on this.

Answer 1

Sorry about that.  We'll be sure to file this behavior into our system to hopefully be addressed in a future release.  In the meantime, we can use some custom script to fix the problem.  Assuming your grid question is row-oriented, please try adding this script to it:

<script>
$(document).ready(function(){
    // Settings
    var inputLabels = [
        'alpha',
        'beta',
        'gamma',
        'delta',
        'epsilon'
    ];
    
    // Run
    $('input[name="hid_row_list_[% QuestionName() %]"]').val().split(',').forEach((row, index) => {
        $('#[% QuestionName() %]_div .mobile_grid_card:nth-child(' + (index + 1) + ') .grid_cell_text').text(inputLabels[row - 1]);
    });
})
</script>

Lines 5-9 are where we need to put the input labels for each row of the question.  You can copy-and-paste and update these to meet your needs.

Comments

Wow, that was quick, thank you! In the meantime I found another (not so elegant) solution myself without using the cell input labels.

<script>
$(document).ready(function(){
    $( "#q38_r1_c1" ).after( "[% ListLabel(q38CellList,1) %]");
    $( "#q38_r2_c1" ).after( "[% ListLabel(q38CellList,2) %]");
    $( "#q38_r3_c1" ).after( "[% ListLabel(q38CellList,3) %]");
    $( "#q38_r4_c1" ).after( "[% ListLabel(q38CellList,4) %]");
    $( "#q38_r5_c1" ).after( "[% ListLabel(q38CellList,5) %]");
    $( "#q38_r6_c1" ).after( "[% ListLabel(q38CellList,6) %]");
});
</script>

---

Ingo, we have located the issue and it will be fixed in LHS v9.14.