- DevOpsAsked on June 23, 2016 at 08:14 AM
Please check this page http://healthysmileslagrange.com/appointment/ . There is an appointment form in this page. On iphone 6+ landscape view the bottom part of the form is not showing. Attached screenshot.
Also check this page http://healthysmileslagrange.com/about-dr-qureshi/ . There is a contact form in the sidebar and the same problem is happening with that form. The bottom part is not showing. Attached screenshot.
Can you please let me know what is the solution?
- BorisAnswered on June 23, 2016 at 10:01 AM
Sorry for the issues with your forms being cut off on some devices. The problem with the form not being able to fully show on that first page ( http://healthysmileslagrange.com/appointment/ ) may come from having multiple forms embedded on the same page:
They are both embedded with the same ID, JotFormIFrame, so when one of them is trying to set its height it will change the height of both forms. Whenever embedding multiple forms on a same page, we recommend changing the ID of your second or third such forms from JotFormIFrame into something like JotFormIFrame2, in all parts of the embed code from those other forms.
However, your second page ( http://healthysmileslagrange.com/about-dr-qureshi/ ) has only one form embedded, and on this one I could see the issue with form height being incorrectly calculated in landscape mode, but only when using Safari browser and only in landscape mode. The Submit button is not showing because the form is cut off just above where the Submit button should be:
I do see that regular portrait mode seems to be working fine:
I also see that iPhone 6 Plus with Chrome works fine, even in landscape mode:
So it seems that only Safari browser of iPhone 6 plus is unable to correctly detect or set the height for the form.
I have forwarded this to our developers, so they can check whether the height detection for iFrame embedded forms can be improved on Safari browser of iPhone 6 in landscape mode. We will update you through this thread when there are any news in this regard. Thank you.
- DevOpsAnswered on June 27, 2016 at 05:46 AM
Any solution from the developers? Please let me know.
- JotForm UI DeveloperberilAnswered on June 27, 2016 at 08:13 AM
First of all thank you for checking the status of your ticket. Unfortunately, there is no update yet. However, one of our developers was already assigned to fix the issue. We will notify you here once we have an update on the status. Thank you for your patience.
- JotForm UI DeveloperibrahimAnswered on June 27, 2016 at 09:21 AM
I do apologize for the issue that you are experiencing with embedding your form. You can inject CSS code for form height. Here's sample code:
Can you please retry re-embedding your form using its iframe or other embed code. User Guide: https://www.jotform.com/help/67-Which-form-embed-code-should-I-use
Please get back to us if you need any further assistance. We will be happy to help.
- DevOpsAnswered on June 28, 2016 at 04:49 AM
Thanks for sending me the solution. But sorry to say it didn't fix the issue. Please check the screenshots. It's happening on iphone 5s too.
The screenshots are from this page appointment form http://healthysmileslagrange.com/appointment/ . I've seen the page source and found that the code exists in there. But it did not fix the problem.
- JotForm Supportashwin_dAnswered on June 28, 2016 at 05:51 AM
I did check your webpage where you have embedded your form and found that you are using iFrame embed code.
Your message has reached my colleague @ibrahim and he will get back to you as soon as he is available online.
- JotForm UI DeveloperibrahimAnswered on June 28, 2016 at 07:07 AM
When i checked your page html source, i saw "height: 1000px" on iframe code block. It doesn't work on landscape mode, since the iframe has fixed height. Could you please re-embed it with this code block:
<iframe id="JotFormIFrame" src="https://form.jotform.me/52172016202439" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
- DevOpsAnswered on June 29, 2016 at 06:28 AM
Thanks a lot! This time the script code worked perfectly. You are awesome!
- BorisAnswered on June 29, 2016 at 06:35 AM
Your praise has reached our colleague, and on behalf of all our colleagues involved, you are most welcome. We're glad that the issue you were having is resolved now.
If there is anything else you may need help with, please simply let us know by opening another support thread anytime, and we will be happy to help.