The second line on Thank you page is cut off when usign iframe embed code

  • Profile Image
    nickphonics18
    Asked on July 07, 2015 at 05:17 PM

    when thank you message appears the second line is cropped off (see screenshot with Firebug on)

    Live link - http://s230164745.websitehome.co.uk/contact.html

    Thanks

     

  • Profile Image
    Ben
    Answered on July 07, 2015 at 06:48 PM

    At first it seemed that the thank you message was properly shown until I saw that second line to check the junk email as well.

    The best way to fix this issue is to set min-height property on the iframe, so that it does not get cut off for a specific amount of height.

    For example, this is the form embedding code that I would suggest to use:

    <iframe frameborder="0" scrolling="no" style="width: 100%; height: 107px; border: medium none; min-height: 160px;" src="//form.jotformeu.com/form/51873260890359" allowtransparency="true" onload="window.parent.scrollTo(0,0)" id="JotFormIFrame"></iframe>
    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;case "collapseErrorPage":if (iframe.clientHeight &gt; window.innerHeight) {iframe.style.height = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    I believe that it will work just as you want it, but do let us know if you have any further issues with this.

  • Profile Image
    nickphonics18
    Answered on July 07, 2015 at 06:57 PM

    Thanks Ben that seems to have solved it.

     

    Can the height of the iframe be set to auto? As I have another issue... If i attach more the 2 files to upload the submit button disappears from the iframe. See screenshot

     

  • Profile Image
    nickphonics18
    Answered on July 07, 2015 at 07:11 PM

    playing around i changed it from 'iframe' to 'embed' and that seems to now work.

     

    is there any disadvantages of using 'embed' instead of 'iframe'?

     

    http://s230164745.websitehome.co.uk/contact.html

    Thanks

    Nick

  • Profile Image
    Charlie
    Answered on July 08, 2015 at 01:42 AM

    Hi Nick,

    The embed code under the "Embed" option is the default embed code, it should work on most of the web pages, but if there are a lot of script codes loaded in the website, it might conflict with the Form's own script code which can make the form fail or have some issues. In that case, we suggest users to use the iFrame embed code, this prevents or avoids any code conflict between the website and your form, the problem with iFrame is that you need to set specific height in "px".

    Could you tell us if using the default embed code the "Thank You" message is not being cut off?

    I made a test submission and it is not being cut off in my end using Google Chrome.

    Let us know if you are still having problems on this.

    Thanks.