Why is part of my form not showing?

glopezespina

Asked on June 20, 2021 at 1:24 PM

Regarding Form: https://www.jotform.com/build/210056502615646

I uploaded the JotForm today, all looked fine on your site as well as when you provided the link to see the published product. However, after copying the source code to my HTML snippet, something changed. This support form only permits one file to be sent for your perusal, so I'm sending the one showing what the copy source code looks like when copied into an HTML snippet on my web page. I could sent you other files via another method that may clarify matters better for you.
In addition, and as you will be able to see, the reCaptcha doesn't show either.

Thanks for your assistance.
Gil

Page URL: https://www.lopez-espina.com/ordering-1.html
Kenneth JotForm Support

Replied on June 20, 2021 at 4:50 PM

Thank you for reaching support,
It appears that there are plenty of Script Conflicts between the form and the site it's embedded to:
To prevent this, can you please embed the form via the iFrame method.
Here is the related guide: https://www.jotform.com/help/148-getting-the-form-iframe-code.
Let us know how it goes.
Best.
glopezespina

Replied on June 20, 2021 at 5:55 PM

Hi Ken,
Thank you for the quick response. I followed the instructions from your
link, but when I pasted the code all I got was a blank form. Please be
aware that I work with EverWeb, a Mac only web designing program. The
program itself doesn't work directly with iFrames, the only access I have
to the code is via HTML snippets. If there exists a widget for iFrame
from someone out there, I really don't know nor if it would function in
this case. Could I overcome this problem in any other way? Please let
me know. Thanks.
Gilbert
...
Kenneth JotForm Support

Replied on June 20, 2021 at 7:04 PM

Hi there,
Cna you try to paste only this portion of the iFrame embed code?
<iframe
   id="JotFormIFrame-210056502615646"
   title="ORDER FORM 2"
   onDISABLEDload="window.parent.scrollTo(0,0)"
   allowtransparency="true"
   allowfullscreen="true"
   allow="geolocation; microphone; camera"
src="https://form.jotform.com/210056502615646"
   frameborder="0"
   style="
   min-width: 100%;
   height:539px;
   border:none;"
   scrolling="no"
  >
  </iframe>
Let us know how it goes.
Thank you for your patience.
Best.
glopezespina

Replied on June 20, 2021 at 9:55 PM

Hi Kenneth;,
Thanks for sending the new code. The good news is that now the page
shows, however, only the top part. Take a look at the screenshot to get a
better idea. I'm sure you'll have a solution for this dilemma as well as
the one previously reported. Please let me know. Much appreciated.
Gilbert
...
Jessica JotForm Support

Replied on June 20, 2021 at 11:55 PM

Hi Gilbert, thank you for reaching back to us.
It appears you have sent your screenshot as an email attachment. Kindly noted that we are unable to accept email attachments within this ticket. You will need to open this ticket, then click on the image icon to upload your screenshot.
Meanwhile, if you are still referring to the following page: https://www.lopez-espina.com/ordering-1.html, I see that your form has been cut and not displaying properly. Kindly reembed using the following code:
<iframe id="JotFormIFrame-210056502615646" title="ORDER FORM 2" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://form.jotform.com/210056502615646" frameborder="0" style=" min-width: 100%; height:1700px; border:none;" scrolling="no" > </iframe>
Please give it a try and let us know how it goes.
glopezespina

Replied on June 21, 2021 at 7:55 AM

Good morning Jessica,
Apparently there is some sort of confusion. I made it clear in my last
email that I copied and pasted the code you sent me shown below into my
HTML snippet and all I got was the upper part of the form. Instead of
sending you the screenshot showing that problem, you could easily look at:
https://www.lopez-espina.com/ordering-1.html and verify that fact for
yourself as well as the source code.
Have a great day and please let me know. Much appreciated.
My best,
Gilbert
...
Girish JotForm Support

Replied on June 21, 2021 at 9:47 AM

Please increase the iFrame height to 1000 px and check:
Do test and let us know.
glopezespina

Replied on June 21, 2021 at 7:00 PM

That increase in height worked, although I had to move up all the way to
1700. Thanks to all members of your team for the great assistance.
My best,
Gilbert
...
glopezespina

Replied on June 21, 2021 at 9:22 PM

So sorry for having to open up this case again. All appeared fine with
the form, the filling process went smoothly, the returned email was
flawless, but I forgot to check one important thing. Why isn't the form
responsive? It's acting as if it's a centered design website. I
searched Google to find out what's going on and ran into this page:
*https://www.jotform.com/help/322-deprecated-how-to-make-mobile-friendly-forms-on-jotform
.*
If you follow those instructions one should get to a little button where
you click *"Make This Site Responsive,"* however, that button is not
there. There is a button that says: *"Enable Form Columns,"* but that
assumes that the form is the only thing on my page—which it isn't.
Whatever number of columns I choose will conflict with the grid layout of
the other things on my page. Not sure what to do, hopefully you'll know.
This is the page with the form: https://www.lopez-espina.com/ordering-1.html
.
Thanks!
Gilbert

...
Jessica JotForm Support

Replied on June 21, 2021 at 10:36 PM

Hi Gilbert,
To avoid confusion, I have moved your second question into another ticket. Kindly refer to the following ticket: https://www.jotform.com/answers/3174163. We will assist you there.