Search code examples
javascriptqualtrics

Qualtrics API not working when put into a custom javascript


I am doing an experiment where a Tower of Hanoi game is embedded in a survey. The game is programmed in Javascript and put into the javascript environment of a question.

I want to disable submit until participants solve the problem. I put this.disableNextButton() in the javascript and it works. But this. enableNextButton() put in a later logic function in the script isn't working.

    Qualtrics.SurveyEngine.addOnload(function()
    {
        /*Place Your Javascript Below This Line*/

    this.disableNextButton();

    Game.prototype.handleDrop = function(event, ui) {
    var tower = this.getTower(jQuery(event.target));
    var disk = this.getDisk(ui.draggable);


    if (tower.getNum() != disk.getTower().getNum()) {

    if (tower.canPlaceDisk(disk)) {
        disk.setDraggableRevert(false);
        tower.moveDisk(disk);
        disk.position();
        this.moves++;
        jQuery("#moves").text(this.moves);
        this.updateDraggableDisks();
        this.checkSolved();

    }
}
    }

    Game.prototype.checkSolved = function() {
if ((this.towers[1].getDisks().length==0) && (this.towers[2].getDisks().length==1) && (this.towers[2].getDisks()[0].getNum()==1)) {

     this.enableNextButton();
    alert("Problem Solved.");
    Qualtrics.SurveyEngine.setEmbeddedData("P1.1",this.moves); /*this sentence must be inside the function, otherwise it will be evluated before the function.*/

    return (this.moves);
    jQuery("#startOver").click();
    }

    }

    });

Does this have to do with "this" object? Because in the logic function, "this" represents the object I defined rather than the Qualtrics survey engine. If yes, what should I do to enable the enbaleNextButton function?

Greatly appreciate your help!

Dani


Solution

  • I'm not sure this your problem (actually I don't think it is), but you can replace:

    this.enableNextButton();
    

    with:

    $('NextButton').show();
    

    Likewise, you can replace:

    this.disableNextButton();
    

    with:

    $('NextButton').hide();
    

    If you looked at code of the Qualtrics functions you would see they are just executing the commands above.

    EDIT: Anthony pointed out that this was for hide/show instead of disable/enable. Disable and enable would be:

    $('NextButton').disabled = true;
    $('NextButton').disabled = false;