Change submit button text conditionally according to question answer? | XM Community
Skip to main content
Is it possible to change the text of the submit button according to a selection on a multiple choice question (on the same page)?



What we are looking to do: if respondent chooses choices one - three, which will result in the survey ending, we want the submit button to say "Submit"; if they choose choice four, which will result in them being redirected to another form, we want the submit button to say something like, "Tell us more about yourself".



Is this possible? Thanks in advance for your thoughts.
Hello @brendontroy ,



You can add js on that question and on selection of choice event, you can change the text of Next Button using below code



`jQuery("#NextButton").attr({value:"Submit",title:"Submit"});`



OR



`jQuery("#NextButton").attr({value:"Tell us more about yourself",title:"Tell us more about yourself"});`
Thanks so much for the quick reply, @Shashi ! I'm afraid I'm new to using JS with Qualtrics ... if you don't mind explaining a tiny bit, would I need to use that code in conjunction with the "getSelectedAnswerValue ( )" and/or "Qualtrics.SurveyEngine.QuestionInfo" methods to somehow change the text according to the selection?



Alternatively, if there's a tutorial for this sort of thing, please feel free to tell me to go there and learn. Thanks!
Hello @brendontroy ,



Assuming you have four option and "Tell us more about yourself" is for the last option then you can paste the below code in the js(onReady) of the question



jQuery("#NextButton").attr({value:"Submit",title:"Submit"});

jQuery('input[type=radio]').change(function() {

if(jQuery("input[type='radio']:last").is(':checked')){

jQuery("#NextButton").attr({value:"Tell us more about yourself",title:"Tell us more about yourself"});}else{

jQuery("#NextButton").attr({value:"Submit",title:"Submit"});}

});
P.S. I tried piecing stuff together and came up with this possibility:



Qualtrics.SurveyEngine.addOnload(function()

{

/*Place your JavaScript here to run when the page loads*/



if (${q://QID1/ChoiceGroup/SelectedChoices} == 'NAMEOFCHOICEFOUROBFUSCATEDHERE')



{

jQuery("#NextButton").attr({value:"Tell us more about yourself",title:"Tell us more about yourself"});

}

else

{

jQuery("#NextButton").attr({value:"Submit",title:"Submit"});

}



});



but I get the error "Invalid JavaScript! You cannot save until you fix all errors: Unexpected token {" ... so obviously I'm missing something ...
> @brendontroy said:

> P.S. I tried piecing stuff together and came up with this possibility:

>

> Qualtrics.SurveyEngine.addOnload(function()

> {

> /*Place your JavaScript here to run when the page loads*/

>

> if (${q://QID1/ChoiceGroup/SelectedChoices} == 'NAMEOFCHOICEFOUROBFUSCATEDHERE')

>

> {

> jQuery("#NextButton").attr({value:"Tell us more about yourself",title:"Tell us more about yourself"});

> }

> else

> {

> jQuery("#NextButton").attr({value:"Submit",title:"Submit"});

> }

>

> });

>

> but I get the error "Invalid JavaScript! You cannot save until you fix all errors: Unexpected token {" ... so obviously I'm missing something ...



Put this ${q://QID1/ChoiceGroup/SelectedChoices} in quotes i.e "${q://QID1/ChoiceGroup/SelectedChoices}"



But please try the answered code as the above code will not work
Thank you SO much, @Shashi! That worked perfectly. Incredibly helpful. Thank you again. All the best.

Leave a Reply