How to change the next button, that it changes color when you submit an answer

SvenESvenE GermanyCommunity Member Qubie ✭

How to change the next button, that it changes color when you submit an answer

Hi, I would like to have the color of my next button to be grey until the participant enters an answer or check a box.

I would like to have this feature on every page and every question type

Thank you!

Answers

  • ahmedAahmedA IndiaCommunity Member Superuser ✭✭✭✭

    Add this to your header:

    <script>
    nb = document.querySelector("#NextButton")
    nb.onclick = function(){ nb.style.background = "tomato"}
    </script>
    
  • SvenESvenE GermanyCommunity Member Qubie ✭

    Hi Ahmed,

    thanks for your help. It is a cool feature, but not the one I was looking for.

    I would like to have the button displayed as below:

    It should be grey (color doesn't matter) as long as the particpant did not answer the question. When he checked a box or entered something it should change to the green version.

    It should be some kind of indication for the participant that he met all the requirements to continue.

    It would be cool to use the feature for any question type.


    Thanks, Sven

  • ahmedAahmedA IndiaCommunity Member Superuser ✭✭✭✭

    Just checking whether a participant has answered or not, is quite different from checking whether they have met all the requirements. In the latter, you'll need to specify the requirements of the answer. However, for the former, you can just use the getSelectedChoices method to change the colour of the next button.

Sign In to Comment