Auto-advance by clicking on heatmap regions | XM Community
Skip to main content
Hi all,



I´m using the following Javascript code to both hide my next button and make advancing to the next page conditional on clicking on the current page.



Qualtrics.SurveyEngine.addOnload(function()

{

$('Buttons').hide();

var that = this;

this.questionclick = function(event,element){

that.clickNextButton();

}

});



This works very well. But I want to modify it such that the transition happens only when "Region1" of the heatmap is clicked on. Could any of you help me with that piece of the code?



Thank you,

Rah
You can't. The Regions are inside an SVG. The closest you can come is advancing when someone clicks on the div containing the heatmap.

```

jQuery("#"+this.questionId+" .HeatMapContainer").on("click", function () [

jQuery("#NextButton").click();

});

```

Note: { changed to [ in the code above to avoid Community 'Access Denied' error.



Also, you should use addOnReady instead of addOnLoad when doing anything with the buttons.
Thank you very much TomG!



As you mentioned, this code does not offer more than what my initial script could do. But it is still good to know.
@Rah,



The difference is your original code would advance if the question was clicked and the code I provided only advances if the image is clicked.
Rah! did you ever figure this out? I'm trying to create a survey that basically mimics Tinder, so they have to click the images or I get no data.
Hi @psychstudentdude



Unfortunately, I couldn't do it through heat-map function. But for a tinder-like effect, I had used a combination of two buttons and auto-advancing which worked quite well.
@psychstudentdude,



If you haven't seen it already, you might find this post of interest. The question text or buttons could easily be images.

Leave a Reply


Terms & Conditions