iPhone 7: when users goes to the next page, the form does not scroll up, it stays in the middle of the second page.

So i got a form with diferentes sections/pages: https://form.jotform.co/70125778033858 works fine in desktop and looks nice. It is embedded here: www.tareasenlinea.mx/ensayo it also looks good and works fine in desktop there.. 

 

I got 2 issues conserning mobile. When you access www.tareasenlinea.mx/ensayo in mobile the first issue is:

 

1.) When you fill in the first section and then click "next" you appear now on section 2 but  in middle of it, not at the top of the form. So user needs to scroll up to start filling the first fields of the second section. I was clear? Again, you click "next" on first section and it takes you to the section section but not to the top of it, like in the middle of the second section because it is the same height you where on section one before click "next". How to fix this?

 

 

2.) I got some fixed position fields which are my totals and in desktop looks fine (they are in section 2), but in mobile they look on top of everything in section top. How to fix this?

What mobile device and browser are you using? I just tested it, and going to the next page, it loaded at the top:

 

Those fields show on to of each other, because they have been customized with CSS to show on one side of the form:

You can fix this by moving this custom code:

#id_52,#id_53,#id_55,#id_69,#id_70 {

    position: fixed;

    display: block;

    left: 0;

}

#id_52{

   top: 180px;

}

#id_53{

    top: 270px;

}

#id_55{

    top: 360px;

}

#id_69{

    top: 450px;

}

#id_70{

    top: 540px;

}

Inside the following code:

@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1){ 

            

}

Like this:

@media screen and (min-device-width: 1200px) and (max-device-width: 1600px) and (-webkit-min-device-pixel-ratio: 1){ 

#id_52,#id_53,#id_55,#id_69,#id_70 {

    position: fixed;

    display: block;

    left: 0;

}

 

#id_52{

   top: 180px;

}

#id_53{

    top: 270px;

}

#id_55{

    top: 360px;

}

#id_69{

    top: 450px;

}

 

#id_70{

    top: 540px;

}

 

}

I have updated this into your form already, so the fields do not show on top of each other in mobile view:

Let us know if you need more help.

Thanks for this man...the issue 2 is solved but the issue 1 still on my side persists...

 

I am using Iphone 7 with safari and chrome and both send me to this part of second section after clicking "next" so as you can see it is not the top of the form :S! 

It will be hard to test, since I can not find an emulator for iPhone 7. Can yo try embedding your form with the Iframe code? https://www.jotform.com/help/148-Getting-the-form-iFrame-code 

Let us know if that help.s

Hi BDavid I tried with IFRAM and the problem still persists... is there anyway you guys can help me? Any of your partners have an iphone 7 and can test it?

 

So I've tested with an Iphone 6 and 5 and the problem also exsits.. maybe in your emulator works but in REAL iphones it is not working.. can you please try it on your personal phone or somebodys phone and let me know if you can re-create the problem?

I have tested your form in my android(5.1) using Chrome browser, but I could not reproduce the problem: https://www.screencast.com/t/Aw0Jf8QI 

Unfortunately, I do not have an iPhone, but I have forwarded this to our back-end team to get further help. You will be notified via this thread about any updates on this matter.

Do we have any news on this? Please help me fix for iphones..

The ticket has been already assigned to one of our developers in the priority of Important and in opened status. 

I will ask if there is any update and you will be informed via this thread.

Thank you in advance for your patience. 

Hi, I have the same issue with other forms and still with this form. Can you give me a solution? Its been 3 months already.

Sorry for the delay.

We haven't heard back an update from our developers. I will ask an update from our dev team with this matter.

Rest assured you will be informed in this thread if there are any updates.

Regards.

Hi, this should be fixed now. If you have further issues please let us know.