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

    Form not moving to the top of the page when next button is clicked.

    Asked by swindells on July 08, 2014 at 07:17 PM
    What is weird is that when you click on the button it takes you to bottom of the new page, not the top, so you have to scroll up for ages. Is there any solution to this do you know?
    iweb source code
  • Profile Image
    JotForm Support

    Answered by BDAVID on July 08, 2014 at 07:28 PM

    Can you provide us the URL of the exact webpage where the form is embedded? Meanwhile, if you are using the iFrame code as an embedded method, I would recommend you to add the following to the code:

    ?nojump

    Example code:

    <iframe allowtransparency="true" src="//www.jotform.com/form/00004705753?nojump" frameborder="0" style="width:100%; height:936px; border:none;" scrolling="no">

    Hope this helps you, let us know if you need more assistance, we will be glad to help you.

  • Profile Image

    Answered by swindells on July 09, 2014 at 03:15 AM

    Hi, heres the URL of the embedded problem page:  http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html 

    Where do I insert the 'no jump' code in the script? I am using iweb.  

    As extra cells have been added on the form 'Gallery 1' it has affected Gallery 2 so i'm not able to decrease the height of Gallery 2 page because it cuts off form Gallery1. Is there any way around this? 

    Thank you

  • Profile Image

    Answered by jedcadorna on July 09, 2014 at 08:21 AM

    Hello,

    I have checked your other thread and with the form embedded using an iframe it doesn't have any issues with scrolling the bar on top of the page whenever next button is clicked. Using the form standalone URL scrolling on top is no issue so probably something is conflicting the embed code if its not yet in an iframe.

    This is the link I found in your other thread http://www.sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form_files/widget0_markup.html.

    If you haven't embedded the form using an iframe on this URL http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html can you please give it a try and let us know if using an iframe works or not?

    About the extra cells added to your "Gallery 2" the question is moved in this thread http://www.jotform.com/answers/401314

  • Profile Image

    Answered by swindells on July 09, 2014 at 08:55 AM

    Hi, thank you for your suggestion. I don't think I want to use an iframe as i want to understand why the form has gone weird in this way.

    Is there a way to find out how to change the code to make the gallery start at top and not bottom of scrollbar?

    Abajan aka Wayne designed this brilliant customised form for me so maybe he will know. Is he there?

    many thanks

  • Profile Image

    Answered by jedcadorna on July 09, 2014 at 10:46 AM

    Hello,

    Unfortunately my colleague Wayne is not online as of this moment.

    When using an Iframe code it does eliminate conflicts with your other javascript libraries in your webpage. I made some test and removing the javascript codes in your page does make the form works properly and whenever I add the deleted scripts that's were the problem start.

    When you use the Iweb embed code it does copy the form source and using a form source does not eliminate the conflicts in your code unlike when you use iframe.

    Here is a sample where the script has been removed https://shots.jotform.com/jed/forms/Sophie%20Swindells%20%20Trade%20Order%20Form.htm.

  • Profile Image

    Answered by swindells on July 09, 2014 at 04:55 PM

    Hello. Thank you for your help but I am a little bit confused. The web sample link you show a link to does not include the form section where people fill in their details. That needs to be on both pages.

    Which part of the script is the problem do you know? I have the form source code plus javascript plus an extra line of script which 'makes user details appear on both pages' and I have to add that in at the end. Which part of that has conflicts in the code?

    Thank you

     

  • Profile Image
    JotForm Support

    Answered by jonathan on July 09, 2014 at 05:26 PM

    Hi,

    I checked the actual source page where the form was embedded here

    http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form_files/widget0_markup.html

    and it was scrolling to top properly when Next button is used. Try it also just to confirm that it was working on your end.

    It seems that there is indeed a script conflict that is preventing the scroll to top when the web page was embedded in your iweb.

    Can you please try re-embedding the form in your iweb using only this embed code http://pastie.org/9372576

    Please try and see if it makes any difference.

    Inform us if issue is not resolved.

    Thanks!

     

     

     

     

  • Profile Image

    Answered by swindells on July 19, 2014 at 07:05 AM

    Hi, I tried re-embedding using that code but it was totally blank: http://www.sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html

     

    The code was only a few lines long. I don't understand. Is there any thing else I can try? The form didn't used to have this problem, its since adding extra images to gallery 1 that the problem has occured in gallery too. Is Abajan/Wayne there do you know? 

    many thanks

  • Profile Image
    JotForm Support

    Answered by jonathan on July 19, 2014 at 08:22 AM

    Hi,

    I think something must have change in the URL where the form was originally embedded.

    This URL was available when we last checked. But it is now returning 404 error which means the web page does not exist anymore.

    Please re-embed the form http://www.jotformeu.com/form/33354994783368  to the web page 

    using its iframe embed code. 

    Follow this user guide -Getting-the-Form-iFrame-Code

    Please update us if the result after you have done this so that we can check further.

     

    Thanks.

     

  • Profile Image

    Answered by swindells on July 19, 2014 at 09:13 AM

    Hi, i've tried embedding the iframe but it's all gone a bit weird. The images no longer get larger when clicked on and the form in gallery 1 has disappeared. Here's the URL: http://www.sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html

    Thank you

  • Profile Image
    JotForm Support

    Answered by jonathan on July 19, 2014 at 10:28 AM

    Hi,

    I truly apologize for the confusion.

    It was incorrect to use the iframe embed code of the form on this page   as I sugggested previously because you were actually using the form's source code originally.

    The custom form was originally done by our colleague Abajan as you mentioned on this thread

    To correct this, please embed instead using the form's source code with the additional scripts on this web page.

    After doing this test the web page. Check if the form is functioning as intended.

    If this is corrected, I think the not moving to top on Next page will also be fixed.

    Please update us if issue still remains so that we can check further.

    Thanks.

  • Profile Image

    Answered by swindells on July 19, 2014 at 10:36 AM

    Hi Jonathan,

    I usually use the form's source code and add a custom script to it. Isn't that what you're suggesting? Have I misunderstood, is there a different script I need to add?

    Here is the custom script I usually add:

    file:///Users/sophieswindells/Documents/Online%20Order%20Form/Code/script.htm

    Im still not sure how to stop it moving on next page.

    Many thanks

  • Profile Image
    JotForm Support

    Answered by Welvin on July 19, 2014 at 01:04 PM

    Hi,

    I'll help you to fix it. Please let me know the final webpage that contains the form with all the scripts that was added to the form source codes. There should be a way to scroll the form to top when the next button is click.

    Thanks

  • Profile Image

    Answered by swindells on July 19, 2014 at 02:11 PM

    Hi Welvin,

    I've reverted to the script and code as it was before trying the iframes. I've embedded it back in iweb. Here's the URL: http://www.sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html

    There are two problems, one is the scrolling problem on second page.

    The second problem is that when the images are clicked on in the right hand column of both pages, half the image is cut off. I have tried resizing the iweb page but this has not helped.

    Your help is really appreciated.

  • Profile Image
    JotForm Support Manager

    Answered by Jeanette on July 19, 2014 at 09:29 PM

    Welvin will certainly get back to you whenever he comes online to help you.

    Cheers!

  • Profile Image
    JotForm Support

    Answered by Welvin on July 20, 2014 at 11:58 AM

    Hello,

    This is the HTML block where the form is placed: http://www.sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form_files/widget0_markup.html. When the Next button is clicked, you will noticed that the form goes back to top. 

    I don't think we can fix this into the iWeb section. So, instead of embedding the form to the iWeb HTML block, I would suggest saving the Form Source Codes with all the added Scripts as an HTML file and upload it to your FTP Server. Use the direct link of the HTML file and link it to your webpage, then make it to open in a new window. 

    I'll check the zoom images.

    Thanks

  • Profile Image

    Answered by swindells on July 21, 2014 at 09:38 AM

    Hello, i'm not sure I understand this. How do I upload files to FTP server? I uploaded the whole of the iweb site to FTP hostpapa but i'm not sure how to upload an HTML file by itself to FTP. Not sure where to begin with this. Is there really no way it can be done with HTML snippet? 

     

    Would Abajan/ Wayne know do you think as he made the form. 

     

    Also, any thoughts on the zoom images?

     

    Thank you

  • Profile Image
    JotForm Support

    Answered by Welvin on July 21, 2014 at 10:32 AM

    Same process, I think. Are you using an FTP Client such as FileZilla? Or, you have uploaded the iWeb website directly to the FTP Manager in your Hostpapa Control Panel?

    The steps:

    1. Get your form source codes here with all the scripts added to it here http://pastiebin.com/53cd1fb6be51b

    2. Open your Notepad or any text editor you have

    3. Paste the Source codes there and save it as an HTML file. For example: 

     

    4. Open your FTP Client or access your File Manager

    5. Upload the saved HTML file to the root directory or to any directory you want.

    6. Get the direct link of the HTML file. For example, if you have uploaded the HTML file to the root directory: http://www.sophieswindells.co.uk/my-form.html

    7. Add this link to your website. Set it to open in a new window. For example: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_link_target

    Unfortunately, I'm not sure if we can do this inside the iWeb HTML Snippet. I search for a possible solution, but I can't find any. I'm so sorry.

     

    I have already contacted Wayne about this matter. He's helping me about the Zoom Images, and the most possible way to fix that is to assign another class or ID to the left or right zoom images so we can apply another CSS codes for the alignment. Unfortunately, this is a long process for us. Wayne is currently thinking of an easiest way.

    Thanks

  • Profile Image

    Answered by swindells on July 21, 2014 at 12:35 PM

    Hi Welvin, Thank you for the step by step. I saved it as HTML then uploaded it to root directory in hostpapa file manager but am now stuck. How do I get direct link and how do I add the file to my website? Where exactly do i do that? Also, I can't see any option to open in new window. 

    Sorry that I need it spelled out. I've looked online for help but can't seem to work it out even though its probably really obvious!

    Thank you!

     

  • Profile Image
    JotForm Support

    Answered by Welvin on July 21, 2014 at 12:51 PM

    What is the HTML file name? If you have uploaded it to the root directory, then the direct link should be like this:

    http://www.sophieswindells.co.uk/HTML-FILE-NAME.html (replace HTML-FILE-NAME to the actual file name).

     

    ------------------

    How do I add the file to my website? - and open it on a new window:

    -Add another HTML block or Snippet to your iWeb website page then, paste the following codes:

    <a target="_blank" href="http://www.sophieswindells.co.uk/HTML-FILE-NAME.html" rel="nofollow" >Order Now!</a> 

    Again, replace HTML-FILE-NAME to the actual file name. Also change "Order Now!" to any text you want.

    Let us know if you need further assistance.

    Thanks

  • Profile Image

    Answered by swindells on July 21, 2014 at 01:11 PM

    Hi, I tried that and something is not right. Here's the URL: http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html

     

    I uploaded the HTML to file manager public html. Then I put the code you wrote with the ammended file name and pasted that into iweb snippet on order form page (I deleted the previous code).

     

    Thank you

  • Profile Image
    JotForm Support

    Answered by Welvin on July 21, 2014 at 01:49 PM

    We're close there :). You just need to correct the link. Can you please take a screenshot of how the file has been uploaded to your Hostpapa File Manager? You may have uploaded the HTML file on a sub-directory. You should upload that to the same directory where the iWeb files are uploaded.

    Thanks

  • Profile Image

    Answered by swindells on July 21, 2014 at 03:09 PM

  • Profile Image

    Answered by swindells on July 21, 2014 at 03:11 PM

    Hi, here's a screenshot. After your last post I deleted the file from the root directory and put it under 'sophie swindells' where the iweb files are. Its still no working though. The files called 'sophieswindells_scriptnew. 

     

    Cheers! 

     

  • Profile Image
    JotForm Support

    Answered by Welvin on July 21, 2014 at 03:24 PM

    This is the correct link: http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells_scriptnew.htm. Correct File Name is: Sophie_Swindells_scriptnew.htm

    However, you seem to have pasted the source codes into an MS Word document. That is not correct. Use Text Editors, download Sublime text: http://www.sublimetext.com/. Save it again per instructions, as an HTML file. Upload it to the same directory.

    Edit the page: http://sophieswindells.co.uk/Sophie_Swindells/Sophie_Swindells__Trade_Order_Form.html and change the link of the Order Form.

    Thanks

  • Profile Image

    Answered by swindells on July 21, 2014 at 04:16 PM

    That worked! Thank you. I didn't know about Sublime, that made all the difference. Is it possible to make it so that when people click on Order Form it takes straight there rather than having to click on another link? 

    Here's a screenshot, the alignment has been messed up a bit, i'm not sure why. The quantity boxes have slipped down. Any ideas on this? Was it the conversion from MS Word to Sublime do you think?

  • Profile Image

    Answered by swindells on July 21, 2014 at 04:19 PM

    That screenshot didnt show what I mean very clearly. Sorry. Here's a better one:

     

  • Profile Image
    JotForm Support

    Answered by david on July 21, 2014 at 05:45 PM

    Hi,

    I checked your website and the formatting appears to be fine:

    It appears you are using Chrome as your web browser.  I tested in Chrome also and could not reproduce the formatting.  As my colleague stated, using the iFrame embed code rather than the javascript code may help to correct this.

    http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code

    Let us know if you have any other questions and we will be happy to help.

    Thank you for using Jotform!

     

  • Profile Image

    Answered by swindells on July 21, 2014 at 05:58 PM

    Hi, I tried it in a different browser and formatting is still out. The quantity buttons have slipped down. I've uploaded this form via FTP so not sure I can use iframe code, tried that earlier on in this thread and it didn't work. 

     

    When Welvin returns it would be great if he knows how to stop the images being cropped off the side?

     

    Many thanks!

     

  • Profile Image
    JotForm Support

    Answered by Welvin on July 22, 2014 at 01:26 AM

    For The Quantity Boxes:

    Please don't copy and paste the codes from the MS Word document.  Surely, some of the codes are stripped out. I have the copy of the codes, you should have look here instead: http://pastiebin.com/53cd1fb6be51b.

    Again, save these source codes into the HTML file and re-upload it to your Hostpapa File Manager. Make sure to upload it to the same location or directory.

    Example output (no quantity boxes formatting issues): https://shots.jotform.com/welvin/pages/Sophie_Swindells_scriptnew.html

     

    ----------------------------------------

    For the ZOOM Images:

    Please proceed on this thread: https://www.jotform.com/answers/406556. Use this thread for the issues with regards to the Zoom Images. Do not mix it up here for us to avoid some confusions. I am already into the process of changing the locations of the zoom images. As previously stated, this is a long process since we need to change some of the elements for us to inject the custom CSS codes.

     

    Thanks

  • Profile Image

    Answered by swindells on July 22, 2014 at 03:47 AM

    Hello, i've been copying and pasting using MS Word as a notepad for a long time so that would have messed up the code. I didn't realise.

    I tried to open the link you attached in pastiebin, but it says the link is forbidden. Please can you resend the code script if you have it.

    I then tried copying the forms script again and adding pastie javascript to the bottom using sublime but it hasn't worked. 

    Thank you

  • Profile Image
    JotForm Support

    Answered by jonathan on July 22, 2014 at 04:51 AM

    Hi,

    You can also copy the full script from this link https://shots.jotform.com/jonathan/files/script-406556.txt  if the pastebin link provided by our colleague Welvin is not available.

    Inform us if still not able to get the scripts.

    Thanks.

     

     

  • Profile Image

    Answered by swindells on July 22, 2014 at 05:50 AM

    Hi, I tried the script you suggested Jonathon but now the form lost it's form section and quite a lot of quantity buttons as well as the whole of the second page. There was some javascript added on at the bottom of the script. Abajan sent me it so I add it on every time from this link: http://pastie.org/pastes/8513668/text

    I'll revert back to old one for now but if you have any other ideas of how to get code cleaned up that would be amazing. Many thanks.

     

  • Profile Image

    Answered by swindells on July 22, 2014 at 06:04 AM

    Hi, Welvin has now sorted out this issue on a different thread. I'm very pleased with it.

    Thank you Jot Form support!