dynamic variable creation in decisions table

[Philipp Schreck]

Dear All,

 

I want participants to be able to generate a random value (0-10) multiple times on the same stage. They can do this by cklicking a button. I would like to track  (i.e. store in the decisions table)

1. how often they click the button and
2. which random value is generated each time.

 I use the following code.

 

let timesClicked = parseInt(localStorage.getItem("timesClicked"));

function genvalue() { 

timesClicked++;

let randomval= Math.floor(Math.random() * 11);

let randomValKey = `randomval${timesClicked}`;

localStorage.setItem('randomValKey', randomval);

localStorage.setItem("timesClicked", timesClicked);        

setValue('timesClicked',timesClicked);

record('randomValKey', randomval);

 

    console.log(`Stored ${randomval} in ${randomValKey}`);

    console.log(`Button clicked ${timesClicked} times`);

}

 

Locally, the dynamic key works fine , but I fail to store a new variable (randomval1, randomval2, etc.) in the database each time the button is clicked. What happens is that one single variable called "randomValKey" is created once, and then updated with each button click.

 

Can anyone advise how to change the line

 

record('randomValKey', randomval);

 

such that the value of "randomValKey" is used to create a new variable (rather than using the literal string 'randomValKey' in the record function)?.

 

Any suggestion will be much appreciated, thanks a lot in advance!

 

Best, Philipp

[Philipp Schreck]

Thanks for your quick response, Lucas! For some reason, it does not appear here, so I'll copy and paste it below:

*************

Hi Philipp,
record() does not work within a function. This because having this in a loop is sensitive to exploding the number of variables and clogging the development server.
You can take record() outside the function and use setValue within it.
If you have a dynamic number of values, you might consider storing the generated values in a JS element, e.g. a vector, and write this vector as a comma separated string to the database when the participant leaves the page by clicking the ‘Continue’ button.
Cheers, Lucas

*************

Your solutions works fine, thanks again. Should anyone ever need something similar, here's the code I use in the JS program (beginning of stage):

// Initialize variables from local storage
let timesClicked = localStorage.getItem("timesClicked") ? parseInt(localStorage.getItem("timesClicked")) : 0;
let randomValue = localStorage.getItem("randomValue") ? parseInt(localStorage.getItem("randomValue")) : 0;
let randomValues = localStorage.getItem("randomValues") ? JSON.parse(localStorage.getItem("randomValues")) : [];

// define function which will be called on button click
function genvalue() {  
    timesClicked++;
    randomValue= Math.floor(Math.random() * 11);
    randomValues.push(randomValue);
    localStorage.setItem("timesClicked", timesClicked);
    localStorage.setItem("randomValue", randomValue);
    localStorage.setItem("randomValues", JSON.stringify(randomValues));

    console.log(`Button clicked ${timesClicked} times`);

    console.log(`Stored random values: ${randomValues}`);
}

Finally, in the program under the 'continue' button I use:

setValue('timesClicked',timesClicked);
var randomValuesString = randomValues.join(',');
setValue('randomValuesString',randomValuesString);

Best, Philipp