Issue with jQM new popup widget and iFrame #61

Closed
bardu opened this Issue Oct 13, 2012 · 8 comments

Comments

Projects
None yet
2 participants
@bardu

bardu commented Oct 13, 2012

Over at jQm they recommend loading a Google map inside an iFrame to use with the new popup widget, see:

http://jquerymobile.com/demos/1.2.0/docs/pages/popup/popup-iframes.html

I have managed an implementation with Backbone and require, but have an issue when the popup closed in that I traverse back to a black page. Then I need to click the browsers back button but this brings me not to the view the popup was opened.

My guess would be that the history of the iFrame is in the way. If so, is there a way to prevent that?

From a smartphone you can access a live demo, go to:

www.yxyapp.com

click on "At your service" --> "Real Estate" and there on the first item in the list. In the next view click on "Deals" in the navigation bar. There swipe down and click on the "View on map" button and the map will popup. Tap anywhere beside the map to close it.

If you want to check from a computer please go to:

www.yxyapp.com/mobile/index.html

Hope that helps to track down the issue.

@azicchetti

This comment has been minimized.

Show comment Hide comment
@azicchetti

azicchetti Oct 13, 2012

Owner

I think this issue is not related to the router because it can't do anything to "harm" pages or application layouts. Popups don't even trigger page events.
The issue may reside in jquery mobile itself (but it's not likely) or in some event handler used in your code.

If you provide a tgz or a zip file of the source code, I'll try and see if the issue can be tracked down in a short amount of time.

Cheers,
Andrea

Owner

azicchetti commented Oct 13, 2012

I think this issue is not related to the router because it can't do anything to "harm" pages or application layouts. Popups don't even trigger page events.
The issue may reside in jquery mobile itself (but it's not likely) or in some event handler used in your code.

If you provide a tgz or a zip file of the source code, I'll try and see if the issue can be tracked down in a short amount of time.

Cheers,
Andrea

azicchetti added a commit that referenced this issue Oct 14, 2012

Fixed issue #61.
Support for popup events was added
@azicchetti

This comment has been minimized.

Show comment Hide comment
@azicchetti

azicchetti Oct 14, 2012

Owner

It turns out I was wrong.

The router was forcing a useless changePage that, under normal circumstances, is harmless.
In this specific case, jQuery Mobile was failing, probably due to a bug, during the page transition.

@bardu found out that the issue could be partially solved by disabling the slide effect.

However, I've patched the router to avoid the forced changePage when the popup is closed.

Owner

azicchetti commented Oct 14, 2012

It turns out I was wrong.

The router was forcing a useless changePage that, under normal circumstances, is harmless.
In this specific case, jQuery Mobile was failing, probably due to a bug, during the page transition.

@bardu found out that the issue could be partially solved by disabling the slide effect.

However, I've patched the router to avoid the forced changePage when the popup is closed.

@azicchetti azicchetti closed this Oct 14, 2012

@bardu

This comment has been minimized.

Show comment Hide comment
@bardu

bardu Oct 18, 2012

I have a new use case where I need to initialize and open a popup programmatically like:

$('#popupLogin').popup();
$('#popupLogin').popup('open');

Then I see the same issue as of before your patch, could you please check?

bardu commented Oct 18, 2012

I have a new use case where I need to initialize and open a popup programmatically like:

$('#popupLogin').popup();
$('#popupLogin').popup('open');

Then I see the same issue as of before your patch, could you please check?

@bardu

This comment has been minimized.

Show comment Hide comment
@bardu

bardu Oct 18, 2012

$('#popupLogin').popup({ history: false });

didn't help either.

bardu commented Oct 18, 2012

$('#popupLogin').popup({ history: false });

didn't help either.

@azicchetti

This comment has been minimized.

Show comment Hide comment
@azicchetti

azicchetti Oct 18, 2012

Owner

Hi bardu,
unfortunately the popup api and implementation seem way too inconsistent to build something on them.
The .popup("open") call don't even trigger a pagebeforechange event, nor popup events.
Writing a patch without these hook points is impossible.

I've noticed, however, that if you have a link such as:

<a href="#popupMap" id="mylink123" data-rel="popup">Open Popup</a>

Calling:

$("#mylink123").trigger("click");

produces the expected results (jQM fires the right events and the router can perform its task).

Owner

azicchetti commented Oct 18, 2012

Hi bardu,
unfortunately the popup api and implementation seem way too inconsistent to build something on them.
The .popup("open") call don't even trigger a pagebeforechange event, nor popup events.
Writing a patch without these hook points is impossible.

I've noticed, however, that if you have a link such as:

<a href="#popupMap" id="mylink123" data-rel="popup">Open Popup</a>

Calling:

$("#mylink123").trigger("click");

produces the expected results (jQM fires the right events and the router can perform its task).

@bardu

This comment has been minimized.

Show comment Hide comment
@bardu

bardu Oct 18, 2012

Hi Andrea,

I have tried your suggestion before, but it didn't work in my use case, and I run into more issues with the popup widget not related to routing.

I find the popup widget pretty useful, but as you said, it isn't mature enough to build something on it.

So, for now I will revert to a dialog widget for my latest use case and will see what jQM 1,2,1 has to offer regarding popup.

bardu commented Oct 18, 2012

Hi Andrea,

I have tried your suggestion before, but it didn't work in my use case, and I run into more issues with the popup widget not related to routing.

I find the popup widget pretty useful, but as you said, it isn't mature enough to build something on it.

So, for now I will revert to a dialog widget for my latest use case and will see what jQM 1,2,1 has to offer regarding popup.

@azicchetti

This comment has been minimized.

Show comment Hide comment
@azicchetti

azicchetti Oct 18, 2012

Owner

Il 18/10/2012 18:33, bardu ha scritto:

I find the popup widget pretty useful, but as you said, it isn't mature
enough to build something on it.

So, for now I will revert to a dialog widget for my latest use case and
will see what jQM 1,2,1 has to offer regarding popup.

If you don't mind, I'll email you a popup widget I've been using for the
last year in my jQM projects.
It's a small backbone view with a couple of methods, but you can easily
revert it to a standard function if you want.

Owner

azicchetti commented Oct 18, 2012

Il 18/10/2012 18:33, bardu ha scritto:

I find the popup widget pretty useful, but as you said, it isn't mature
enough to build something on it.

So, for now I will revert to a dialog widget for my latest use case and
will see what jQM 1,2,1 has to offer regarding popup.

If you don't mind, I'll email you a popup widget I've been using for the
last year in my jQM projects.
It's a small backbone view with a couple of methods, but you can easily
revert it to a standard function if you want.

@bardu

This comment has been minimized.

Show comment Hide comment
@bardu

bardu Oct 18, 2012

Much appreciated, I'm using backbone anyway!

bardu commented Oct 18, 2012

Much appreciated, I'm using backbone anyway!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment