Dear Qualtrics-community,
I'm currently implementing a code to roll a random dice on Qualtrics, and I found great help & code in this forum to implement a random dice, see e.g., https://www.qualtrics.com/community/discussion/8840/roll-a-dice-using-javascript-in-qualtrics). In my survey, I want the participants to roll the dice one or three times (depending on condition), and therefore I would like to double check whether they have actually rolled the dice one or three times depending on condition. I've found a few possibilities to implement this, however, so far I couldn't make any of them work. I know that you can hide and show the next Button simply with the function this.showNextButton(); or this.hideNextButton();, I could also enable/disable the next button with this.enableNextButton(); or this.disableNextButton(); until a condition is met. So I thought of simply making it impossible to proceed until the participant has rolled the dice once or three times depending on condition.

My current code is a follows:
Question HTML:
">https://www.descil.ethz.ch/projects/1305-SensQuest/dice/dice.js">
 

 

Question javascript:
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
var value_set = =
   {key:"1",probability:1},
   {key:"2",probability:1},
   {key:"3",probability:1},
   {key:"4",probability:1},
   {key:"5",probability:1},
   {key:"6",probability:1}
  ];

 var images = {
    base_url:'https://www.descil.ethz.ch/projects/1305-SensQuest/dice/img/',
  ext:'.png',
  init: 'qmark1.png'
 };

  new Dice("dice1","throw1",{
  possible_throws: 1,
  value_set: value_set,
  images: images,
  result_callback: function(throw_nr,result_key){
    Qualtrics.SurveyEngine.setEmbeddedData('result_matrix_embedded'+ throw_nr, result_key);
  }
  }); 
});

I simply changed possible_throws: 3 in the roll the dice 3 times condition.

I've had the following ideas of implementing the "condition is met" part and included these in the Qualtrics.SurveyEngine.addOnReady(function(){

1. I access the dice number and check whether it is between 1 and 6, and if so show the Next Button. The code is as follows: var dice1 = parseInt(Qualtrics.SurveyEngine.getEmbeddedData("result_matrix_embedded1"));

if (dice1 >= 1 && dice1 <=6){
this.showNextButon();
} 
else {this.hideNextButton();}
--> I had the idea that in the die rolling 1 time condition, I simply check result_matrix_embedded1, while I check result_matrix_embedded3 in the die roll 3 times condition. This code doesn't work, and I thought that maybe the result_matrix_embedded1 is not accessible yet when I'm on the page where it gets saved? I did set result_matrix_embedded1, result_matrix_embdeed2, and result_matrix_embedded3 in the survey flow in the beginning & they do get saved (I checked in the dataset afterwards).
2. Another code that I found and slightly adjusted to my needs was the following:
I set a variable called Clicked_dice in the embedded variables in the beginning and set it to 0
this.hideNextButton();
var clicked = parseInt(Qualtrics.SurveyEngine.getEmbeddedData("Clicked_dice"));
$('throw1').on('click', function(name, event) {
clicked++
Qualtrics.SurveyEngine.setEmbeddedData('Clicked_dice',clicked);
});
if (clicked == 1){
this.showNextButton();
}
Here I was hoping of simply changing clicked == 3 in the die roll 3 condition, however, this code also didn't work.
3. Another possibility I saw and adjusted:
this.hideNextButton();
jQuery( "#throw1" ).click(function() {this.showNextButton();});
4. I also saw the following:
var clicked = parseInt(Qualtrics.SurveyEngine.getEmbeddedData("Clicked_dice"));
var button = document.getElementById("throw1");
button.addEventListener("click", function(){
clicked ++});
Qualtrics.SurveyEngine.setEmbeddedData('Clicked_dice',clicked);
if (clicked == 1){
this.showNextButton();
}

These were the different possibilities I've thought of and found online, but they so far don't work. If anybody has any tips/ideas what I need to alter, that would be really helpful!
Thanks a lot in advance,
Annika