Add Start Over Button | XM Community
Skip to main content

Hi everyone,
I'm looking to add a start over button next to the submit button. With the code below I have a button next to the submit button, but I cannot seem to change any attributes with CSS nor can I add the hyperlink.
JS:
Qualtrics.SurveyEngine.addOnReady(function()
{ 
document.querySelector("#NextButton").value = "Submit"
jQuery("#NextButton").before("");
});

CSS:
.Skin #Buttons #NextButton {
 border: none !important;
 color: #fff !important;
 font-size: 160px !important;
 padding: 8px 20px !important;
 -webkit-border-radius: 4px !important;
 -moz-border-radius: 4px !important;
 -ms-border-radius: 4px !important;
 -o-border-radius: 4px !important;
 border-radius: 4px !important;
 cursor: pointer !important;
 margin: 0 !important;
 text-align: center !important;
 text-decoration: none !important;
 -webkit-appearance: none !important;
 background-color: #635BFF !important; 
 opacity: 100 !important;
}

Any assistance would be greatly appreciated! Thank you!

justinp
Why don't you use the survey flow (End of Survey) element and customize the options to redirect the survey to the anonymous link?
image.pngHope it helps!

justinp,
Add an id to the start over button, like this:
jQuery("#NextButton").before("");
Then use the id to style with CSS:
.Skin #Buttons #StartOver { /* styles go here */ }
And/or, add an event handler:
jQuery("#StartOver").click(function() { /* click logic goes here */ });

TomG Thank you! Button and CSS worked great. I'm still trying to figure out how to get the button hyperlinked within the event handler. Below is the code. I can see that the hyperlink is being applied correctly, but when I click on the button nothing happens.

Qualtrics.SurveyEngine.addOnReady(function()
{ 
document.querySelector("#NextButton").value = "Submit →"
jQuery("#NextButton").before("");
jQuery("#StartOver").click(function() {
jQuery(StartOver).wrap('https://xyz" />');
});
jQuery("#NextButton").before("");
jQuery("#AskQuestion").click(function() {
jQuery(AskQuestion).wrap('https://xyz" />');
});
});

https://community.qualtrics.com/XMcommunity/discussion/comment/52478#Comment_52478Two things:

  1. You have a syntax errors. StartOver and AskQuestion are undefined. Use jQuery(this) instead.

  2. .wrap() isn't going to give the desired result. Use either 
    window.location.href="https://xyz"
    or add a link instead of a button and style it to look like a button.

TomG Thank you! Worked as expected.

Leave a Reply


Terms & Conditions