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

    Thank you message not visible in Internet Explorer 8 (IE8)

    Asked by baldwinandlyons on June 19, 2015 at 10:21 AM

    Hello,

    I recently did some testing of our embedded forms in IE8. The forms themselves work fine, but once the form is submitted, the custom confirmation message is not visible. You can see the top few pixels of the letters, but the container is not tall enough to show all of it. See attached screenshot.

    The confirmation message displays properly in IE9 and above.

    How can we make the confirmation message appear visibly in IE8?

    Thanks.

    Page URL:
    https://www.protectiveinsurance.com/loss-prevention/services-programs/<br/>driver-recognition

    Screenshot
    Thank You message message not visible thank
  • Profile Image
    JotForm Support

    Answered by Charlie on June 19, 2015 at 11:42 AM

    Upon checking your website, I see that you are using the default embed code which uses the <script> tag, it might be conflicting with your website's code when read in IE 8.

    Could you try using the iFrame embed code and see if that will work for your website? 

    We'll wait for your response.

    Thank you.

  • Profile Image

    Answered by baldwinandlyons on June 26, 2015 at 12:47 PM

    Hi Charlie,

    I don't think we can use the iFrame method on our website. The website is responsive, so we would have to make the iFrame very tall to accommodate the one-column view of the form. Having very tall iFrames for all our forms would make the desktop version of the site look awkward.

    I tested using the iFrame method with this form today, and on the second page of the form, several of the fields were not visible in the iFrame using the default code provided by Jotform. We would prefer not to use the iFrame method.

    Thanks,

    Julia

  • Profile Image
    JotForm Support

    Answered by Charlie on June 26, 2015 at 02:23 PM

    Hi Julia,

    I'm thinking two ways we can try to resolve this.

    Method 1: Try using a jQuery noConflict using your default <script> embed code. See if that prevents any code conflict on the resizing of the thank you page.

     

    Method 2: Use the iFrame embed code but have a specific styling for the mobile responsive, here's an example.

    @media screen and (min-width: 100px) and (max-width: 720px) {

    #iFrameIDHere {

    height: 500px !important;

    }

    }

     

    @media screen and (min-width: 721px) {

    #iFrameIDHere {

    height: 700px !important;

    }

    }

     

    Depending on the size of the current screen, you can set the height of the iFrame, although you will still have some extra spaces. Make sure though that you add it inside the <head> tag of your website.

    If the above method doesn't work, let us know and we will investigate further, there might be a need to escalate it to our developers if other solutions failed.

    We'll wait for your response. I hope that helps.

  • Profile Image

    Answered by baldwinandlyons on July 01, 2015 at 05:31 PM

    Hi Charlie,

    Is this the right way to use a JavaScript noConflict with the default embed code?

    <script type="text/javascript" src="https://secure.jotformpro.com/jsform/50845636711962">$.noConflict();</script>

    If so, it did not fix the issue.

    We have many forms, so we would prefer not to add media queries to all of them. That would be quite time-consuming and difficult to manage. We would have to update the media queries every time we added fields to the forms, and it would make adding a form to our website a developer task rather than something business users could do.

     

  • Profile Image
    JotForm Support

    Answered by EltonCris on July 01, 2015 at 10:22 PM

    Try it with this.

    <script type="text/javascript">jQuery.noConflict();</script>

    <script type="text/javascript" src="https://secure.jotformpro.com/jsform/50845636711962"></script>

    If that doesn't make any difference, then try the following using $ alias.

    <script type="text/javascript">$.noConflict();</script>

    <script type="text/javascript" src="https://secure.jotformpro.com/jsform/50845636711962"></script>

    By the way, I am not quite sure if this is some kind of script conflict since the form functionality is working just fine on your page. I think this is most likely a browser compatibility or styling issue on IE8. Stand alone form works perfectly on IE8, so I would suggest to try embedding the form using its source code. This works similarly with script embed so this might as well help. http://www.jotform.com/help/104-How-to-get-the-Full-Source-Code-of-your-Form

    We'll await your updates.

  • Profile Image

    Answered by baldwinandlyons on July 06, 2015 at 01:04 PM

    I tried using both versions of the noConflict code and it did not help.

    We would prefer not to embed using the full source code because every time we add/remove a field, we would have to re-embed the form. We have a lot of forms, so that would become a lot to deal with.

    Also, just to test, I tried embedding this form with the iframe embed code (even though that is not our preference, as described above). It did not resolve the issue. Only the top few pixels of the confirmation message were visible in IE8, even though the iframe was specified to be 2117px tall.

  • Profile Image
    JotForm Support

    Answered by Charlie on July 06, 2015 at 01:47 PM

    Apologies for the inconvenience. It seems like it's related to how IE8 is reading the back end code.

    Could you try this one:

    In your "Thank You" message, open the HTML editor and wrapped it with a <div> element with a style attribute of min-height.

    1. In the "Thank You" page wizard, click the "HTML" icon to open the editor.

    2. Here, wrap message in a <div> element. Here's mine:

    <div style="min-height: 300px !important">

    ....Content

    </div>

     

    See if that should work, if not, we'll try to investigate it deeper and at the same time forward it to our developers to have it checked. I also sent a test submission, you might have received an email about it.

     

  • Profile Image

    Answered by baldwinandlyons on July 07, 2015 at 10:12 AM

    That solved it! This is a manageable solution for us. Thank you.

  • Profile Image
    JotForm Support

    Answered by Charlie on July 07, 2015 at 10:21 AM

    Great to hear that it worked. If you needed any assistance again, please do not hesitate to contact us anytime.

    Cheers!