What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Keep back button at same position on each page

    Asked by reciproc8 on July 22, 2013 at 03:31 PM

    Hey guys

    Is it possible to keep the back page positioned in the exact same spot on each page?  I created a form that has a page break in between each question and every time you hit next and go to the next page, the next button moves in its position according to the field.  For the sake of uniformity, is there a way to keep the next buttons positioned in the exact same place on each page?  Ex; 300px from the top?  

     

    Thanks

    back button next thanks
  • Profile Image

    Answered by EliezerN on July 22, 2013 at 03:57 PM

    Thanks for contacting us.

    To accomplish what you need, please insert this custom CSS code to your form:

    .form-pagebreak-back, .form-pagebreak-next

    {

    position:fixed !important;

    top:250px !important;

    }

    Please refer this guide to know how to Inject Custom CSS Codes to your form: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    I cloned your form to do the changes, you can see mine and clone it if it's helpful for you, here it is: http://www.jotform.com/form/32026659287966

     

    If you need further assistance, please let us know.

    Thanks.

  • Profile Image

    Answered by reciproc8 on July 22, 2013 at 05:30 PM

    Great thanks. I did the same for the back button.  But now it does not work properly where I have it embedded.  The first next button (re-labeled as Apply) does not respond.  

  • Profile Image

    Answered by pinoytech on July 22, 2013 at 05:37 PM

    Hi,

    Can you please provide us URL of your website where your form embedded for further assistance?

    Thank you!

  • Profile Image

    Answered by reciproc8 on July 22, 2013 at 05:48 PM
  • Profile Image

    Answered by EliezerN on July 22, 2013 at 06:03 PM

    hello,

    You didn't need to insert more code to your form, I had included the two buttons, back and next, in the code. 

    Also I found that there was missing a period before the form-pagebreak-back.

    This is the code you added: 

    form-pagebreak-back, .form-pagebreak-next{position:fixed !important;top:275px !important;}

    form-pagebreak-back, .form-pagebreak-back{position:fixed !important;top:275px !important;}

    Please remove it and  insert this one:

    .form-pagebreak-back, .form-pagebreak-next

    {position:fixed !important;

    top:275px !important;

    }

    That will affect both buttons. And if that does not work, please let us know.

    Thanks

  • Profile Image

    Answered by reciproc8 on July 22, 2013 at 06:08 PM

    On the embedded form, on the 2nd page for name and email, the next and back buttons do not show up

  • Profile Image

    Answered by EliezerN on July 22, 2013 at 06:15 PM

    You are right, I am also unable to see them. But that was probably because the code you had injected was the same, so your form has the next code twice.

    form-pagebreak-back, .form-pagebreak-next

    {

    position:fixed !important;

    top:275px !important;

    }

    So, that produced a conflict in the code. Please kindly try with the code I just gave you in the previous answer.

    Thanks

  • Profile Image

    Answered by reciproc8 on July 23, 2013 at 04:41 PM

    I just did, it only has that code once and its still doing the same thing.

  • Profile Image

    Answered by reciproc8 on July 23, 2013 at 04:43 PM

    Now the Apply (next) button does not work

  • Profile Image

    Answered by EliezerN on July 23, 2013 at 05:00 PM

    I have checked the code.

    I have cloned your form to make some tests and it works fine, maybe if you try to reduce the amount it get resolved. Please try removing the current code and insert this one:

    .form-pagebreak-back, .form-pagebreak-next

    {

    position:fixed !important;

    top:230px !important;

    }

    If that does not work' let us know.

    Thanks.


  • Profile Image

    Answered by reciproc8 on July 23, 2013 at 08:15 PM

    The buttons show up on the preview but they do not show up on the page in which the form is embedded.  I reduced the amount to 230px and still the same problem. 

    Thanks

  • Profile Image

    Answered by khrisell on July 23, 2013 at 10:06 PM

    Hello,

    Have you tried clearing your browser cache and cookies reciproc8? 

    Let us know if problem persists after clearing browser cache and cookies, so that we could further check on the codes.

     

    Thank you.

  • Profile Image

    Answered by reciproc8 on July 24, 2013 at 12:15 AM

    Hi

    Thanks for your help so far.  The problem is still there.  I have done a hard refresh and cleared cookies and cache.

     

    Thanks

  • Profile Image
    JotForm Support

    Answered by Morian on July 24, 2013 at 03:04 AM

    Hi! I checked your site and while I can see the apply button, the back button is also in the first page, which obviously should not be the case and neither buttons are working.

    I checked your stand-alone form and it is woking fine.

    Can you please try to remove the embed code and try to re-embed again? If it's not resolved, please let us know. Thanks!

  • Profile Image
    JotForm Support

    Answered by abajan on July 24, 2013 at 03:26 AM

    @reciproc8

    Please replace your current form code with its iFrame equivalent. Upon searching the forum, I was able to find a user with the same issue and it was resolved once the iFrame version of the form code was substituted for the default.

  • Profile Image

    Answered by reciproc8 on July 24, 2013 at 01:31 PM

    Works great, thanks!