bottom portion of embedded form is not showing in web page

Hello, 

When viewed on a Mac device, the bottom of the contact form is sometimes missing. If I refresh the screen the complete form occassionally appears.  I have just viewed this form on a PC desktop and tablet and the bottom part of the form was missing. I didn't try refreshing the screen when I had access to these PC devices, so don't know if that would have worked too. I would like the complete forms present on screen when the page is opened first time.  One image attached shows the complete form viewed on a Mac and the other is a mock-up of how the form looks when bottom part is missing. Sorry I don't the formats/OS systems used on of these PC devices. Grateful for any advice, thanks.

I checked the embedded form http://www.jotformeu.com/form/60612699705361   on your website and I can see the full form on it.

Can you also try first re-embedding the form using its iframe embed code.

Here is the user guide on Getting-the-Form-iFrame-Code

Make sure to clear first previous script embed code on the page before adding the fresh embed code.

Let us know if issue still remains even after this.

Thanks.

Hi Jonathan,

Thanks for your suggestion. After deleting previous form, I re-embedded the form using iFrame. Unfortunately, the bottom of the form is still disappearing. The issue is erratic, when I first open the page, the whole form is sometimes visible. However if I changed the the browser window width the bottom of the form vanishes. The amount of the form that is cut off at the bottom varies as well. The website is responsive (dynamic) and produced in Muse. Any more suggestions welcome

In the beginning of your iFrame code, there is a height attribute:

<iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformeu.com/60612699705361" frameborder="0" style="width:100%;
      height:539px;
      border:none;" scrolling="no">
    </iframe>

Increase this value until the full form shows in your page.

Hi David,

Increased the height to 830px. At first, this seemed to work, although there was a grey area under the form were the form had not filled this new height. However, when I refreshed the page or changed the width of the browser window, the bottom of the form vanished, as before. Grateful for any more ideas. 

I think the script part of the iframe embed was clashing with the existing script on the page.

Please try using instead only the iframe embed code part.

Try this one (iframe part only)

<iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformeu.com/60612699705361" frameborder="0" style="width:100%;

      height:830px;

      border:none;" scrolling="no">

    </iframe>

Make sure to remove/clean first the previous embedded code of the form on the page before using the embed code above.

Let us know how it goes.

Thanks.

Hi Jonathan, 

Thanks for this, unfortunately it hasn't worked. I deleted previous form and used this code. On my artwork the form appeared with a large grey box area underneath it. This seems to represent the 830px height allocated, and can be reduced if the pixel height is reduced. Viewed on a browser the form shows the same problem as before - the bottom part is not showing (no grey box showing, as on artwork). When the site page is first opened the whole form may show but if the page is refreshed or the browser window size is changed the form looses the bottom part. 

Not sure where I'm going wrong! Any more suggestions welcome.

After testing extensively, it turned out that the default embed code will work just fine.

Please try this embed code:

<script type="text/javascript" src="https://form.jotform.com/jsform/60612699705361"></script>

You can check it on my test page here.

Please let us know if still did not work for you.

Thanks.

Hi Jonathan,

When using this code - the complete form shows when the site page first opens but, if the browser window changes size or the page is refreshed - the form completely disappears, not just the bottom section. 

It's strange, as I put the form into the site several weeks ago, it's only had this problem in the last week. I did initially have a problem with the PayPal form on this site but with the help of the forum I managed to sort it out.

Thanks for your time on this but any more ideas?

I could replicate the same disappearing behavior.

I created a clone and added the form to the test account and the form was successfully displayed:

http://jotformtest.businesscatalyst.com/form  

I will make further tests and will let you know as soon as I have more details. In the meantime if you can post a screenshot of the html version editor this can be helpful.

Let us know if we can assist you further.   

Hello Carina,

Thanks so much for looking into this for me. As you can see, I have provided a screen shot of the html editing window for the contact form. I think this might not be what you want! If not, could you supply a few more details for the html version editor, and I'll see if I can find it.

You can try increasing the size of the frame the form is being added to.  Try dragging the bottom of the form container to extend the area the form is being added to:

Hello David,

Lengthening or widening the form container window does not make a difference, the form still disappears. Thanks though!

Since there are two forms in your page, the height of one may be affecting the other.  Try embedding the form using this code instead:

<iframe id="JotFormIFrame2" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformeu.com/60612699705361" frameborder="0" style="width:100%;

      height:830px;

      border:none;" scrolling="no">

    </iframe>

That will give the frame a different ID from your payment form.

Hoorah! Thanks-you David your suggestion has worked. I reduced the height to 490 px, otherwise there is a grey box under the form. The form's not perfect - a small portion gets cut off the bottom sometimes but the Submit box is still there, so that's ok. Also sometimes there is a small grey band at the bottom. However, I'm nit picking and I really can't complain. The site can now go live online.

And David, you resolved the problem on my PayPal form too, many thanks!

I'm grateful for everyone's help with this issue :)

Glad to hear it!  We are happy to help.  Let us know if there is anything else we can assist with.