Dynamic Text not updating

Question

Greetings,

I am experiencing an issue where dynamic text is not appearing.  There are two questions:
  CSM5 (grid type question with one row)
  CSM5A (open ended question)

There are two other things on the page that may impact this:
   BLL is running.
   I also have branching with CSM5A as the dependent question (hiding CSM5A until something is selected in CSM5

Code is below.

<script>
  
$(document).ready(function(){
    updateSelectedText();
})
   
$(document).on('lighthouseRadioButtonChanged', function(event, graphicalObj, inputObj) {
    updateSelectedText();
})
   
function updateSelectedText() {
    var independentQuestion = 'CSM5';   // I have tried both versions.  This line and the line below
    var independentQuestion = 'CSM5_r1';   // I have tried both versions.  This line and the line below

    var responseOptions = [% ListLabelsArray(recommendResponseList) %];
    $('.mySelectedText').text(responseOptions[SSI_GetValue(independentQuestion) - 1]);
}
  
</script>

This is the code where I want the text displayed:

<span class="mySelectedText"></span>

One other thing that may be impacting it. The study is done in multiple languages so we do have the <div> stuff going on .

Comments

Assuming CSM5 is row-oriented and using radio buttons, "CSM5_r1" should work.  Two guesses come to mind:

* Are you running Lighthouse Studio 9.12 or above?
* Does your script appear multiple times on the page in some way regarding your multiple languages?

---

I'm running 9.13.1

the script is its own text question.  recommendResponseList has the <div> element for each of the 8 languages.

---

The BLL requires that the content security policy be changed in order to work with more recent versions of Lighthouse Studio.  Have you made this change?

---

No. I'm not aware of this/not sure what it means. Can you explain what it is and how I do so?

---

The study security settings can be found in a tab along with the other general survey settings like style and error messages.  An example of the exact change to make can be found as the last instruction on the BLL page:

http://sawtoothsoftware.com/better-lighthouse-library

On a tangential note, the latest version of the BLL code displays an error message at the top of the survey page when this change has not been made, which will hopefully be a helpful reminder for people that use the tool often.

---

I made the security settings change. No go.  I then removed all other javaScript from that page (well, commented it out using <!-- -->).  Still doesn't work.

I went to an earlier question that uses dynamic text and stole the javascript from there replacing independentQuestion to equal 'CSM5_r1' and replacing responsOptions with the response list.

It's still not doing anything.

---

Can you share your .ssi with us to take a closer look?

Answer 1

Looking at the browser console on this page, it seems like ListLabelsArray is not handling the new lines in your list text, causing the JS to be invalid.  That's disappointing.

To fix that, let's toss out that function and just get the list values ourselves:

    var responseOptions = [% Begin Unverified Perl
        # Parameters
        my $list = 'recommendResponseList';
        
        # Run
        my @output = ();
        my $len = LISTLENGTH($list);
        for (my $i = 1; $i <= $len; $i++) {
            my $text = LISTLABEL($list, $i);
            $text =~ s/\\/\\\\/g;
            $text =~ s/\n/\\n/g;
            $text =~ s/\'/\\\'/g;
            push (@output, '\'' . $text . '\'');
        }
        return '[' . join (',', @output) . ']';
    End Unverified %];

That will end up printing the HTML to the page as text rather than as true HTML elements.  To fix that, we can replace "text" with "html" on this line:

$('.mySelectedText').text(responseOptions[SSI_GetValue(independentQuestion) - 1]);

That gets us real close, but the text will wrap unnaturally because the multi-language tool uses "<div>" elements.  Try force the response option to display inline with the rest of the text, let's add this CSS to the page:

<style>
.mySelectedText .language[data-language="[% language %]"] {
    display: inline;
}
</style>

Comments

Ah, that did it.  I'm still unsure of what the problem was (what 'ListLabelsArray is not handling the new lines in your list text' means), but YAY!

---

ListLabelsArray appears to just print new line characters in its output, causing your JavaScript to look like this when a list item had multiple lines:

var example = ['some text
more text'];

My script produces this valid JS instead:

var example = ['some text\nmore text'];