prevent-focus-zoom doesn't work :(

[nischi]

Hi

I have a jQuery Mobile application and a form with a select-box. Now the Safari on iPhone zoom into the select-box, but this is wrong.
No i have read you documentation and saw the option "prevent-focus-zoom". Now i have following:

....

But the Safari zooms anyway. I think this is correct and must work.

My Versions are:
jQuery: 1.8.2
jQueryMobile: 1.1.1 1981b3f

I used with backbone.js,

-Thanks

[jaspermdegroot]

@nischi

The code you posted after "now I have the following:" isn't visible (at least, not to me). Please provide a test page that illustrates the issue. See the contributing guidelines for more info and our JS Bin template.

[nischi]

@uGoMobi

Sorry for that. Now i have a testcase.

http://jsbin.com/uzaret/545/

[jaspermdegroot]

@nischi

What iPhone / iOS version did you test? We tested http://jsbin.com/uzaret/551 on iPhone 4 / iOS5 and browserstack iPhone 4S / iOS6 and couldn't reproduce.
Test page: http://jsbin.com/uzaret/551 (added a missing id)

[nischi]

i have test this on iPhone 4S and iPhone 5 with Safari and iOS 6.0.1.
No your Testcase worked paritly. When i go the first time on this Form, it works. But a second time or over the label. It zooms anyway :(

[nischi]

Need i an ID for this field for this feature? Exclusive of the label?

[jaspermdegroot]

@nischi

This sounds related to what is described in the thread of this issue #3690

You set the for attribute on the label but not the id attribute on the select so they are not associated, which breaks the layout as you can see.

[nischi]

yes thats clear with the for attribute in the label and the id on the select box. but my question is, have this impact to this functionality?

[toddparker]

@nischi - iOS6 changed something that broke our select zoom fix from 1.1.1 We managed to find a fix and landed that for 1.2 but if you're on 1.1 and iOS6 it will zoom in. We plan on having a final maintenance release for 1.1.2 that will include this fix.

The iOS zoom fix is somewhat brittle and can sometimes still zoom in, even in master, but I'm not sure we can improve it much further. There is already a lot of trickery to make this work as well as it does now. I just wish iOS would let us prevent this behavior, especially when the page fits fine and no zooming is really needed.

If you disable user zoom, it prevents this form happening, but that's not a great tradeoff in most cases.

[jaspermdegroot]

@toddparker - the test page (http://jsbin.com/uzaret/551) uses latest code that contains the fix.

I just tested on browserstack iPhone 5 / iOS6 and could reproduce it when clicking on the label, and when using the next/prev buttons and when the focus is on the text input and you click on the select button.

[toddparker]

I can see the issue now. This is probably because we bind this to the custom select button for the zoom fix, not the label or when focus is shifted. Worth seeing if this is possible to include:
https://github.com/jquery/jquery-mobile/blob/master/js/widgets/forms/select.js#L212

[jaspermdegroot]

@nischi

I committed a fix. Can you confirm the problem is resolved when testing with latest code? http://jsbin.com/uzaret/551

[nischi]

@uGoMobi

When i check this on your jsbin app, this works very good. Now is my question: when is this fix in the stable release?

[jaspermdegroot]

@nischi

Thanks for testing and glad to hear it is fixed.

We are preparing the maintenance releases 1.1.2 and 1.2.1 so you can expect those any time soon.

[nischi]

coool. you are fast:) very very cool. i will show on your page.