With multiple upload files the submit button disappears due to an iFrame height issue

  • Profile Image
    gracelandpb
    Asked on June 10, 2015 at 12:58 PM

    On many of our form, we have the option to upload files - as photos are needed with some of the forms. When more than four or five files are uploaded, the "Submit Form" button at the bottom of the page disappears. It seems that it is moving down the page as the uploaded files are uploading, but when it gets to a certain point, it is gone and the form is unable to be submitted, what could I do to fix this issue?

     

    In the attachment, you can see that the button is close to being too far down the page.

  • Profile Image
    Carina
    Answered on June 10, 2015 at 02:02 PM

    I tested the form and the submit form moves as I add a new file:

     

    Is this form embed on a website? If so please let us know the site url so we can run further tests.

    Let us know if we can assist you further.  

  • Profile Image
    gracelandpb
    Answered on June 11, 2015 at 01:26 PM

    Yes, the form is embedded at this URL - http://www.gracelandportablebuildings.com/repo-clean-out-form. (I am not sure if you will be able to see it, as it is in a secure part of the website that various individuals in our company use.)

    I believe it is the way it is embedded, but haven't figured out what may fix it.

    As you can see in the photo, the bottom part of the form disappears - the text is begin cut off and the submit button is gone.

  • Profile Image
    Mike
    Answered on June 11, 2015 at 03:23 PM

    I was not able to see the form. It is most likely that the form is currently embedded with an iFrame code. Unfortunately, the form iFrame cannot adjust its height automatically.

    As a work around, you can manually set (increase) the iFrame height.

    Please see the next animation:

    Example:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/51615830041950" frameborder="0" style="width:100%; height:792px; border:none;" scrolling="no"></iframe>

    Changed to:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/51615830041950" frameborder="0" style="width:100%; height:950px !important; border:none;" scrolling="no"></iframe>

    You can set any value in pixels.

    Please give it a try and let us know if you need any further assistance.

  • Profile Image
    gracelandpb
    Answered on June 11, 2015 at 03:41 PM

    Thank you, thank you! I was able to fix the issue with your solution of increasing the height.

    Thanks again!!