Have an idea?

Visit Sawtooth Software Feedback to share your ideas on how we can improve our products.

Show an error message if respondent tries to make a selection to click forward before 3 seconds

Hi all,

I am programming a CBC exercise. If respondent tries to make a selection to click forward before 3 seconds, I want to show an error message that says 'Please take your time blablabla.... '. My friend helps me to write some code to pop up the message but every time after the message pops up, people will go to the next page. We could not let them stay.

I find that I could not write custom javascript verification on CBC exercise. If I put some code in the footer, the code will be overrided later. Could anyone help me with that? Many thanks!
asked Dec 20, 2017 by Yolanda-Wong (215 points)
retagged Dec 20, 2017 by Walter Williams

1 Answer

+1 vote
Sounds like you and your friend are going down the right path.  Custom JavaScript verification can stop the page submitting event from going through, but that's not an option for CBCs.  So instead we need to stop the page submitting event from starting in the first place.

There are a number of ways to do this, but the quickest and easiest may be to hide the real submit button for three seconds, showing a fake submit button during that time.  Try adding this script to your CBC:

<script>
$(document).ready(function(){
    $('#next_button').before($('#next_button').clone().attr('id', 'next_button2'));
    $('#next_button').hide();
    var interval = setInterval(function(){
        $('#next_button2').remove();
        $('#next_button').show();
        clearInterval(interval);
    }, 3000);
    $('#next_button2').click(function(){
        // ...
    })
})
</script>


Line 11 can be filled with whatever behavior you want to happen when a respondent clicks the submit button before three seconds.
answered Dec 20, 2017 by Zachary Platinum Sawtooth Software, Inc. (83,675 points)
Thank you for your excellent idea, Zachary! At first we have problem getting the code work. Then we realized that we need to add one more line "$('#next_button2')[0].type = "button"". Then it works perfectly! Thanks again!
...