How to add a custom button between "Previous" and "Next"? | Experience Community
Skip to main content
JoseS
Administrator
1 year ago
Question

How to add a custom button between "Previous" and "Next"?

  • Feb 27, 2021 7:48 PM UTC
  • 3 replies
  • 346 views

I need a button "See a cat" which sends the user to the descriptive "question" with a dog picture. I would be glad to post a minimal working example but after two days I am still clueless.

3 replies

rondev
Level 6 ●●●●●●
Forum|alt.badge.img+22
  • rondev
  • Level 6 ●●●●●●
  • Feb 27, 2021 8:27 PM UTC

Instead of custom code, you can simply make use of multi choice question with blank question text and a single option that says "See a cat". Then you can make use of skip or branch logic to show  the descriptive "question" with a dog picture.

Ron Dev (DM for any request. XM Technology Consultant, surveysolution.in)
  • SunDevil
  • Author
  • Feb 28, 2021 1:52 AM UTC

Thanks, though I would need to find a more straightforward solution as I would use the same code to get back to the question.

Level 7 ●●●●●●●
Forum|alt.badge.img+22
  • ahmedA
  • Level 7 ●●●●●●●
  • Feb 28, 2021 3:24 PM UTC

In your question, add a button with some id.


Use JS to move this element to the "Buttons" container:
document.querySelector("#Buttons").insert(document.querySelector("#cat_button")

Hide the dog question onload using JS: 

this.questionContainer.hide()

Assign an onclick attribute to the cat button to toggle visibility of the questions:
document.querySelector("#cat_button").onclick = function () {
    document.querySelectorAll("[id^=QID]:not(.Separator)").forEach((quest) => {
        if (quest.style.display == "none") quest.show();
        else quest.hide();
    });
};



Terms & ConditionsAccessibility statement