Most popular tags

cbc lighthouse-9 ssi-web ssi-web-8 maxdiff acbc cbc-hb javascript grid-question constructed-list ssi-web-7 free-format unverified-perl skip-logic alternative-specific-design latent-class select-question acbc-summed-price smrt mbc quota-control willingness-to-pay choice-simulator acbc-hb attribute-interactions

Have an idea?

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

Insert text before or after the "next" button in survey

Is this by any means possible?

Thanks,
João
asked Jul 24, 2012 by João Fernandes Bronze (2,040 points)
retagged Sep 13, 2012 by Walter Williams

1 Answer

+4 votes
You can prepend or append any information to any named HTML element using JavaScript/jQuery. If you're using version 8 of SSI Web, below is the code that would allow you to add text before and after the element which has an ID of "next". In this case, I'm using jQuery because it is simple and cool to use. :)
<script>
  $(document).ready(function () {
    $('#next').before('This is text before the Next Button');
    $('#next').after('This is text after the Next Button');
  });
</script>

Just drop this code onto your page, such as the footer area, and it should work its magic.
answered Jul 24, 2012 by Nathan Bryce Silver Sawtooth Software, Inc. (9,505 points)
I'm using version 7.0.26, but with jQuery, so I hope it will work. Thanks, I'll try it! :]
commented Jul 24, 2012 by João Fernandes Bronze (2,040 points)
Do you know how can I break the text into multiple lines? I tried this with no success: http://stackoverflow.com/questions/508269/how-do-i-break-a-string-across-more-than-one-line-of-code-in-javascript
commented Jul 25, 2012 by João Fernandes Bronze (2,040 points)
Also, in free format questions it is working, but in Select Questions, for instance, I inserted the code

<script type="text/javascript">
<!--
  $(document).ready(function () {
    $('#next').before('Clique na seta para prosseguir para a próxima pergunta');
  });
//-->
</script>


into the footer area in each question, and it is not working. Also tried to put it on the <head> tag of the survey, with the same effect. Can someone help me?
commented Jul 25, 2012 by João Fernandes Bronze (2,040 points)
The code below illustrates two ways to break up a line. First, if you are trying to break up a long JavaScript string into multiple lines, then create a variable and break it up as I have done below in the variable "paragraph." Second, if you are trying to break up the display of the string, then you can use regular HTML in your string, as I have done with the <br> and the <strong> tags below.
<script>
  var paragraph = "This is the text <br>";
  paragraph += "<strong>BEFORE</strong> ";
  paragraph += "the Next Button. ";
  jQuery(document).ready(function () {
    jQuery('#next').before(paragraph);
    jQuery('#next').after('This is text after the Next Button');
  });
</script>
commented Jul 25, 2012 by Nathan Bryce Silver Sawtooth Software, Inc. (9,505 points)
João, your code looks good. However, if you are in SSI Web 7, because MooTools is also running, there may be a conflict with the $ symbol, since both MooTools and jQuery use that symbol as a shortcut. So I would replace the $ with jQuery as I did in the above code.
commented Jul 25, 2012 by Nathan Bryce Silver Sawtooth Software, Inc. (9,505 points)
Thanks for all the help, Nathan. It worked out with the <br> tag (I can't believe I didn't remember that). My problem now is the fact that when breaking the string into multiple lines, SSI Web will put the remaining lines above the first one, so they'll end up above the "next" button, i. e. misaligned. I don't know if I was clear and I also don't know if you know something on controlling the alignment of the text to become vertically aligned with the button.

Also, do you know how to display this text in a Select question, for instance? As I've written before, I put the code "everywhere", but it's only working in the free format questions, and I need it to work in all of them :\

Sorry if I'm abusing! :]

João
P.S.: By the way I'm already using a jQuery slider with success in my questionnaire, without the jQuery, so I guess it will work either ways...
commented Jul 25, 2012 by João Fernandes Bronze (2,040 points)
Hello again,

I wonder if instead of text it would be possible to insert an image before the "next" button. Anyone knows something on this?
commented Aug 3, 2012 by João Fernandes Bronze (2,040 points)
Late, late auto-reply, but it may still be useful to someone:

<script>
    jQuery(document).ready(function ()
    {
        jQuery('#next').before('<img src="[%GraphicsPath()%]/texto.png" alt="arrow" border="0">');
    });
</script>


If someone knows something on vertically aligning the text or an image, please let me know!

Thanks
commented Sep 5, 2012 by João Fernandes Bronze (2,040 points)
Powered by Question2Answer
...